Android之UI学习篇十:使用TabHost实现微博客户端界面
16lz
2021-01-23
这里模拟微博客户端进行案例开发,由于没有图片资源,所以就做了一个大体结构类似的案例,跟大家分享一下它的实现,这里采用的是使用xml布局结合TabActivity控制。
先看看实现的效果:
工程目录结构:
以下是源代码:
MainActivity.java
package com.tablehost.activity;import android.app.Activity;import android.app.TabActivity;import android.content.Intent;import android.os.Bundle;import android.speech.SpeechRecognizer;import android.widget.RadioButton;import android.widget.RadioGroup;import android.widget.RadioGroup.OnCheckedChangeListener;import android.widget.TabHost;import android.widget.TabHost.TabSpec;public class MainActivity extends TabActivity implements OnCheckedChangeListener{private TabHost tabHost;private RadioGroup radioGroup;private RadioButton radioButton1;private RadioButton radioButton2;private RadioButton radioButton3;private RadioButton radioButton4; @Override public void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.main); //获取TabHost组件 tabHost = getTabHost(); //新建一个标签页 TabSpec tabSpec1 = (TabSpec)tabHost.newTabSpec("HOME").setIndicator("HOME"); //给标签页设置内容 tabSpec1.setContent(new Intent(MainActivity.this,HomeActivity.class)); //把标签页添加到TabHost当中去 tabHost.addTab(tabSpec1); TabSpec tabSpec2 = (TabSpec)tabHost.newTabSpec("COMMENT").setIndicator("COMMENT"); tabSpec2.setContent(new Intent(MainActivity.this,CommentActivity.class)); tabHost.addTab(tabSpec2); TabSpec tabSpec3 = (TabSpec)tabHost.newTabSpec("SAVE").setIndicator("SAVE"); tabSpec3.setContent(new Intent(MainActivity.this,SaveActivity.class)); tabHost.addTab(tabSpec3); TabSpec tabSpec4 = (TabSpec)tabHost.newTabSpec("MORE").setIndicator("MORE"); tabSpec4.setContent(new Intent(MainActivity.this,MoreActivity.class)); tabHost.addTab(tabSpec4); setUpView(); //关联RadioButton 和 TabHost radioGroup.setOnCheckedChangeListener(this); } //我的一贯作风 public void setUpView(){ radioGroup = (RadioGroup)findViewById(R.id.group); radioButton1 = (RadioButton)findViewById(R.id.radioButton1); radioButton2 = (RadioButton)findViewById(R.id.radioButton2); radioButton3 = (RadioButton)findViewById(R.id.radioButton3); radioButton4 = (RadioButton)findViewById(R.id.radioButton4); }@Overridepublic void onCheckedChanged(RadioGroup group, int checkedId) {switch (checkedId) {case R.id.radioButton1:tabHost.setCurrentTabByTag("HOME");break;case R.id.radioButton2:tabHost.setCurrentTabByTag("COMMENT");break;case R.id.radioButton3:tabHost.setCurrentTabByTag("SAVE");break;case R.id.radioButton4:tabHost.setCurrentTabByTag("MORE");break;default:break;}}}
package com.tablehost.activity;import android.app.Activity;import android.os.Bundle;public class CommentActivity extends Activity {@Overrideprotected void onCreate(Bundle savedInstanceState) {super.onCreate(savedInstanceState);setContentView(R.layout.comment);}}
其他几个Activity类似
在工程的src 目录下新建了一个目录: drawable ,里面新建一个button.xml,用来定义radioButton的选中等不同状态时,显示不同的背景图片:
button.xml:
<?xml version="1.0" encoding="utf-8"?><selector xmlns:android="http://schemas.android.com/apk/res/android"> <!-- 当单选框可用,且获得焦点还没有按下显示的背景 --> <item android:state_enabled="true" android:state_focused="true" android:state_pressed="false" android:drawable="@drawable/home_btn_bg_s"> </item> <!-- 当单选框可用,且被按下时显示的背景 --> <item android:state_enabled="true" android:state_pressed="true" android:drawable="@drawable/home_btn_bg_s"> </item> <!-- 当单选框可用,且被选中了时的背景 --> <item android:state_enabled="true" android:state_checked="true" android:drawable="@drawable/home_btn_bg_d"> </item> </selector>
main.xml:
<?xml version="1.0" encoding="utf-8"?><LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="fill_parent" android:layout_height="fill_parent" android:orientation="vertical" ><!-- TabHost的id写固定值,在Activity通过getTabHost()方法才能取得到 --> <TabHost android:id="@android:id/tabhost" android:layout_width="fill_parent" android:layout_height="fill_parent"> <!-- 放置frame视图和标签页 --> <LinearLayout android:layout_width="fill_parent" android:layout_height="fill_parent" android:orientation="vertical"> <FrameLayout android:id="@android:id/tabcontent" android:layout_width="fill_parent" android:layout_height="wrap_content" android:layout_weight="1.0"> </FrameLayout> <TabWidget android:id="@android:id/tabs" android:layout_width="fill_parent" android:layout_height="wrap_content" android:visibility="gone"> </TabWidget> <RadioGroup android:id="@+id/group" android:layout_width="fill_parent" android:layout_height="50dp" android:background="@drawable/tab_bg" android:gravity="center_vertical" android:orientation="horizontal"> <RadioButton android:id="@+id/radioButton1" android:layout_width="fill_parent" android:layout_height="wrap_content" android:button="@null" android:text="@string/home" android:drawableTop="@drawable/icon_1_n" android:gravity="center_horizontal" android:background="@drawable/button" android:layout_weight="1" android:checked="true"/> <RadioButton android:id="@+id/radioButton2" android:layout_width="fill_parent" android:layout_height="wrap_content" android:button="@null" android:text="@string/comment" android:drawableTop="@drawable/icon_2_n" android:gravity="center_horizontal" android:background="@drawable/button" android:layout_weight="1"/> <RadioButton android:id="@+id/radioButton3" android:layout_width="fill_parent" android:layout_height="wrap_content" android:button="@null" android:text="@string/save" android:drawableTop="@drawable/icon_3_n" android:gravity="center_horizontal" android:background="@drawable/button" android:layout_weight="1"/> <RadioButton android:id="@+id/radioButton4" android:layout_width="fill_parent" android:layout_height="wrap_content" android:button="@null" android:text="@string/more" android:drawableTop="@drawable/icon_4_n" android:gravity="center_horizontal" android:background="@drawable/button" android:layout_weight="1"/> </RadioGroup> </LinearLayout> </TabHost></LinearLayout>
<?xml version="1.0" encoding="utf-8"?><LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="fill_parent" android:layout_height="fill_parent" android:orientation="vertical" android:background="@drawable/b"> <TextView android:layout_width="fill_parent" android:layout_height="wrap_content" android:text="Hello world! CommentActivty" /></LinearLayout>
其他几个布局文件相似。
更多相关文章
- [记录点滴]在Ionic和Android中上传Blob图片
- android 实现保存图片到相册
- android图片裁剪
- Tabwidget- TabWidget选择标签
- Android 中保存图片的代码
- android之将图片转化为圆形图片
- Android 使用decodeFile方法加载手机磁盘中的图片文件
- Android:使用SpannableString实现图片替换相应的文字
- Android 加载图片并存放在缓存中