Open source project androidutil-implemented with fragment Tabhost

Original from: Miroslav |http://fangjie.sinaapp.com/?p=141 Reprint please indicate the source

Learning Android also for some time, feel that most of the Android applications have a lot of similar components, so it is intended to do such an open-source project, the purpose is to integrate some of the Android development common components demo, easy to use in the future project directly. Git address: Https://github.com/JayFang1993/AndroidUtil

Needless to say, first of all, the implementation of the first common component tabhost. Before we can be implemented by inheriting Tabactivity, later in the API is not recommended in this way, so today we mainly talk about using fragment to achieve tabhost.
In many apps, such as Sina Weibo, there is a bottom tab tabhost. First look at the effect after implementation.

First, the realization of tabhost

Each tab of the Tabhost is implemented through Radiogroup, and each tab is a RadioButton. The content area of the page except Tabhost is fragment. The following is a specific layout file Main.xml

<relativelayout xmlns:android= "http://schemas.android.com/apk/res/android" xmlns:tools= "http// Schemas.android.com/tools "android:layout_width=" match_parent "android:layout_height=" Match_parent "Tools:context =". Mainactivity "> <textview android:layout_width=" fill_parent "android:layout_height=" 48DP "a Ndroid:layout_centerhorizontal= "true" android:gravity= "center" android:id= "@+id/title" android:text= " Chang Tai Soft Court "android:textsize=" 18DP "android:textcolor=" #a8aeb5 "android:typeface=" Monospace "Android : background= "@drawable/title_bg"/> <button android:layout_width= "Wrap_content" Android:layout_heig ht= "Wrap_content" android:layout_alignparentright= "true" android:text= "Done" android:textcolor= "#a8ae B5 "android:layout_margintop=" 10DP "android:layout_marginright=" 8DP "android:background=" @drawable/do Ne "/> <button android:layOut_width= "Wrap_content" android:layout_height= "wrap_content" android:background= "@drawable/back" and Roid:textcolor= "#a8aeb5" android:text= "Back" android:layout_alignparentleft= "true" Android:layout_mar gintop= "10DP" android:layout_marginleft= "8DP"/><framelayout android:id= "@+id/content" Android : layout_below= "@id/title" android:layout_width= "fill_parent" android:layout_height= "Fill_parent"/> < Radiogroup android:id= "@+id/main_radio" android:layout_width= "fill_parent" android:layout_height= "48DP" Androi d:layout_gravity= "Bottom" android:orientation= "horizontal" android:layout_alignparentbottom= "true" android:backgr ound= "@drawable/tabhost_bg" > <radiobutton android:id= "@+id/rb_home" android:drawabletop= "@drawable /tab1 "style=" @style/tab "android:text=" Home "/> <radiobutton android:id=" @+id/rb_at "s tyle= "@style/tab" android:drawabletop= "@drawable/tab2" android:text= "Favorites"/> <radiobutton android:id= "@+id/rb_mess" style= "@style/tab" android:drawabletop= "@drawable/tab3" android:text= "I"/> &l T                  RadioButton android:id= "@+id/rb_more" style= "@style/tab" android:drawabletop= "@drawable/tab4" android:text= "More"/> </RadioGroup></RelativeLayout>

Each tab style: Width, height, background picture These are all the same. So it's written in a style file. Styles.xml

<resources xmlns:android= "Http://schemas.android.com/apk/res/android" >    <style name= "tab" >        <item name= "Android:layout_height" >48dp</item>        <item name= "Android:layout_width" >match_ parent</item>        <item name= "android:layout_weight" >1</item>        <item name= "Android: Gravity ">center</item>        <item name=" android:textsize ">10dp</item>        <item name=" Android:paddingtop ">8dp</item>                <item name=" Android:background "> @drawable/tabhost_bg_selector </item>        <item name= "Android:textcolor" > #a8aeb5 </item>        <item name= "Android:button" > @null </item>    </style>     </resources>

To be able to create tab-pressed effects, a selector is designed for the tab background. Tabhost_bg_selector.xml

<selector xmlns:android= "Http://schemas.android.com/apk/res/android" >    <item android:drawable= "@ Drawable/tabhost_press "  android:state_pressed=" true "/>    <item android:drawable=" @drawable/tabhost_ Press "android:state_checked=" true "/>    <item android:drawable=" @drawable/tabhost_bg "/></selector >

At this point, all the layout files about Tabhost have been finished. Here's a look at the Java code in activity. Mainactivity.java

public class Mainactivity extends Fragmentactivity {private Fragmentmanager fragmentmanager;    Private Radiogroup Radiogroup; Private RadioButton Rb1; @Overrideprotected void OnCreate (Bundle savedinstancestate) {super.oncreate (    Savedinstancestate); Setcontentview (R.layout.activity_main);          Fragmentmanager = Getsupportfragmentmanager ();      Radiogroup = (radiogroup) Findviewbyid (R.id.main_radio);    rb1= (RadioButton) Findviewbyid (r.id.rb_home); Radiogroup.setoncheckedchangelistener (New Radiogroup.oncheckedchangelistener () {@SuppressLint ("Newapi") public VO ID oncheckedchanged (radiogroup Group, int checkedid) {rb1.setbackgrounddrawable (Getresources (). getdrawable (R.            Drawable.tabhost_bg_selector));              Fragmenttransaction transaction = Fragmentmanager.begintransaction ();            Contentframe fragment = null;            Switch (checkedid) {case 0:fragment= new contentframe ();            Break CasE 1:fragment= new Contentframe ();            Break            Case 2:fragment= New Contentframe ();            Break            Case 3:fragment= New Contentframe ();            Break            default:fragment= new Contentframe ();            Break              } transaction.replace (R.id.content, (Fragment) Fragment);          Transaction.commit ();    }    });    Set default to check the first item Radiogroup.check (1);    Radiogroup.check (0); Sets the background effect pressed rb1.setbackgrounddrawable (Getresources (). getdrawable (R.drawable.tabhost_press));}}

For each tab's content interface code, write a layout file content.xml

<linearlayout xmlns:android= "http://schemas.android.com/apk/res/android"    android:layout_width= "Match_ Parent "    android:layout_height=" match_parent "    android:orientation=" vertical ">    <textview     Android:layout_width= "Match_parent"    android:layout_height= "match_parent"            android:id= "@+id/content"        /></linearlayout>

The Java code for the Content section is similar to the activity, but it needs to inherit fragment rather than activity. Get a view from Content.xml and replace the view with the Fragment section in Main.

public class Contentframe extends fragment{public    View Oncreateview (layoutinflater inflater, ViewGroup container, Bundle savedinstancestate) {        View view = inflater.inflate (r.layout.content, null);        TextView TextView = (TextView) View.findviewbyid (r.id.content);        Textview.settext ("Hello World");        return view;}    }

Add : The above code is taken into account in Android 3.0 before the API without fragment, import Android-support-v4.jar after the code, there are several differences:

1. Import android.support.v4.app.* should be imported before 3.0; This package fragment related classes, 3.O can be directly imported into the android.app.*;
2. 3.0 before the mainacitivity to inherit from the fragmentactivity,3.0 after the direct inheritance from activity;
3. 3.0 Before Fragmentmanager = Getsupportfragmentmanager (); after 3.0 Fragmentmanager = Getfragmentmanager ();

Welcome to The attention of my personal site:http://fangjie.sinaapp.com/