码迷,mamicode.com
首页 > 微信 > 详细

Android自定义实现微信标题栏

时间:2016-04-11 14:16:17      阅读:434      评论:0      收藏:0      [点我收藏+]

标签:

 

Android自定义实现微信标题栏

    前言:在android的开发中有时我们需要更个性化的标题栏,而不仅仅是系统预定义的图标加软件名,同时有时候我们需要在标题栏中实现更多功能,如添加按钮响应用户点击。这就要求我们实现自定义标题栏。下面以微信的标题栏为例:

微信界面的标题栏:

技术分享

   step 1:写标题栏布局文件

    新建一个布局文件titleBar.xml文件:

 

 1 <?xml version="1.0" encoding="utf-8"?>
 2 <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
 3     android:layout_width="match_parent"
 4     android:layout_height="match_parent"
 5     android:background="#434343"
 6     >
 7     
 8     <TextView
 9         android:id="@+id/barText"
10         android:layout_alignParentLeft="true"
11         android:layout_width="wrap_content"
12         android:layout_height="wrap_content"
13         android:textColor="#FFFFFF"
14         android:layout_centerVertical="true"
15         
16         android:textSize="20sp"
17         android:layout_marginLeft="5dp"
18         android:text="微信(4)"
19         />
20 
21     <ImageView
22         android:id="@+id/barAdd"
23         android:layout_width="wrap_content"
24         android:layout_height="wrap_content"
25         android:src="@android:drawable/ic_menu_add"
26         android:layout_alignParentRight="true"
27         android:layout_marginRight="10dp"
28         android:layout_centerVertical="true"
29         />
30     
31      <ImageView
32         android:id="@+id/barSearch"
33         android:layout_width="wrap_content"
34         android:layout_height="wrap_content"
35         android:src="@android:drawable/ic_menu_search"
36         android:layout_toLeftOf="@+id/barAdd"
37         android:layout_marginRight="20dp"
38         android:layout_centerVertical="true"
39         />
40 </RelativeLayout>

  step2:在源文件OnCreat中添加:设置titleBar.xml为标题栏布局

1     public void onCreate(Bundle savedInstanceState) {
2         super.onCreate(savedInstanceState);
3         requestWindowFeature(Window.FEATURE_CUSTOM_TITLE);
4         setContentView(R.layout.main);
5         //设置标题布局为titlebar
6         getWindow().setFeatureInt(Window.FEATURE_CUSTOM_TITLE, R.layout.titlebar);
7 }

step3:定义标题栏的风格

在drawable新建color.xml:

1 <?xml version="1.0" encoding="utf-8"?>
2 <color xmlns:android="http://schemas.android.com/apk/res/android" >
3            <item name="android:color">#434343</item>  //设置背景色
4 </color>

在values新建titleStyle.xml:

1 <?xml version="1.0" encoding="utf-8"?>
2 <resources>
3     <style name="MyStyle" parent="android:Theme.Light">
4           <item name="android:windowTitleSize">50dp</item>//设置宽度
5           <item name="android:windowTitleBackgroundStyle">@drawable/color</item> //设置背景风格,否则可能有边框
6     </style>
7 </resources>

在AndroidManifest.xml中修改配置:

在application中添加:android:theme="@style/titleStyle"

step4:添加点击处理:

在修改源文件为:

 1 public class WeixinActivity extends Activity implements OnClickListener{
 2     /** Called when the activity is first created. */
 3     public ImageView addBtn;
 4     public ImageView searchBtn;
 5     
 6     @Override
 7     public void onCreate(Bundle savedInstanceState) {
 8         super.onCreate(savedInstanceState);
 9         requestWindowFeature(Window.FEATURE_CUSTOM_TITLE);
10         setContentView(R.layout.main);
11         //设置标题布局为titlebar
12         getWindow().setFeatureInt(Window.FEATURE_CUSTOM_TITLE, R.layout.titlebar);
13         
14         addBtn=(ImageView)this.findViewById(R.id.barAdd);
15         searchBtn=(ImageView)this.findViewById(R.id.barSearch);
16         
17         addBtn.setOnClickListener(this);
18         searchBtn.setOnClickListener(this);
19 
20     }
21 
22     @Override
23     public void onClick(View v) {
24         // TODO Auto-generated method stub
25         switch(v.getId()){
26         case R.id.barAdd:Toast.makeText(WeixinActivity.this, "你点击了添加", Toast.LENGTH_SHORT).show();break;
27         case R.id.barSearch:Toast.makeText(WeixinActivity.this, "你点击了搜索", Toast.LENGTH_SHORT).show();break;
28         default:break;
29         }
30     }
31 }

step5:运行

 技术分享

 ok

这样就完成了,图片我用的系统的图片,不太美观,大家可以自己修改

 

Android自定义实现微信标题栏

标签:

原文地址:http://www.cnblogs.com/cxyc/p/5377873.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!