Android UI advanced Android Hidden Layout drawer use method _android

Recently in writing an application, want to put the Settings page and application page together, so that users can see their settings in real time to the impact of the UI, so more convenient to set the user's favorite interface. After a while, I found that this effect can be achieved by using the Slidingdrawer control. Which is a drawer. Pull open the drawer, occupy half of the screen, the other half of the screen or display application page. The effect is still good.

Share with you today the effect of this drawer on Android. In fact, the Android Lanucher is a drawer, open it to see the installation of the application. I'm sure you've all seen it before. Let's do the same thing, of course, just the same effect on the UI.

Slidingdrawer This control is very simple to use, basically in the XML configuration can be. The code looks like this.

Copy Code code as follows:

<?xml version= "1.0" encoding= "Utf-8"?>
<relativelayout
Xmlns:android= "Http://schemas.android.com/apk/res/android"
Android:layout_width= "Fill_parent"
android:layout_height= "Fill_parent"
>
<textview
Android:layout_width= "Fill_parent"
android:layout_height= "Wrap_content"
android:text= "@string/hello"
Android:textsize= "20SP"
/>
<slidingdrawer
Android:id= "@+id/sd"
Android:layout_width= "Match_parent"
android:layout_height= "Match_parent"
Android:handle= "@+id/iv"
Android:content= "@+id/mycontent"
android:orientation= "Vertical"
>

<imageview
Android:id= "@+id/iv"
Android:layout_width= "Wrap_content"
android:layout_height= "Wrap_content"
android:src= "@drawable/open1"
/>

<gridview
Android:id= "@id/mycontent"
Android:layout_width= "Wrap_content"
android:layout_height= "Wrap_content"
Android:numcolumns= "3"
android:background= "@drawable/background"
android:gravity= "Center"
/>

</SlidingDrawer>
</RelativeLayout>

Under the Slidingdrawer label Android:handle: The picture of the drawer is indicated. Android:content: It points to the layout inside the drawer. With this layout, actually a drawer came out.

Now let's look at the code for this class Chouti

Copy Code code as follows:

public class Chouti extends activity {

Private GridView GV;
Private Slidingdrawer SD;
Private ImageView IV;
Private int[] Icons={r.drawable.browser,r.drawable.gallery,
R.drawable.camera,r.drawable.gmail,
R.drawable.music,r.drawable.market,
R.drawable.phone,r.drawable.messages,r.drawable.maps};
Private string[] items={"browser", "Picture", "Camera", "clock", "Music", "Market", "dial", "info", "Map"};

/** called the activity is a. */
@Override
public void OnCreate (Bundle savedinstancestate) {
Super.oncreate (savedinstancestate);
Setcontentview (R.layout.main);
GV = (GridView) Findviewbyid (r.id.mycontent);
SD = (slidingdrawer) Findviewbyid (R.ID.SD);
iv= (ImageView) Findviewbyid (R.ID.IV);
Myadapter adapter=new Myadapter (this,items,icons);//custom Myadapter to achieve icon Plus item display effect
Gv.setadapter (adapter);
Sd.setondraweropenlistener (New Slidingdrawer.ondraweropenlistener ()/Open drawer
{
@Override
public void ondraweropened ()
{
Iv.setimageresource (R.DRAWABLE.CLOSE1)//In response to the open drawer event, the picture is set downward
}
});
Sd.setondrawercloselistener (New Slidingdrawer.ondrawercloselistener ()
{
@Override
public void ondrawerclosed ()
{
Iv.setimageresource (R.DRAWABLE.OPEN1);/In response to close drawer event
}
});
}
}

Inside the entire class, the layout is imported, while the monitor event for the switch drawer is set. In this case we need to customize a myadapter to display the picture with the text subscript.

Here's the code for the Myadapter class.

Copy Code code as follows:

public class Myadapter extends Baseadapter
{
Private context _ct;
Private string[] _items;
Private int[] _icons;

Public Myadapter (Context ct,string[] items,int[] icons)//builder
{
_CT=CT;
_items=items;
_icons=icons;
}

@Override
public int GetCount ()
{
return _items.length;
}

@Override
Public Object getitem (int arg0)
{
return _ITEMS[ARG0];
}

@Override
public long getitemid (int position)
{
return position;
}

@Override
Public View GetView (int position, View Convertview, ViewGroup parent)
{
Layoutinflater factory = Layoutinflater.from (_CT);
View V = (view) factory.inflate (R.LAYOUT.GV, NULL);//Bind custom layout
ImageView IV = (ImageView) V.findviewbyid (R.id.icon);
TextView TV = (TextView) V.findviewbyid (R.id.text);
Iv.setimageresource (_icons[position]);
Tv.settext (_items[position]);
return v;
}
}

is also very simple, where the layout used is as follows

Copy Code code as follows:

<?xml version= "1.0" encoding= "Utf-8"?>
<linearlayout
Xmlns:android= "Http://schemas.android.com/apk/res/android"
android:orientation= "Vertical"
Android:layout_width= "Fill_parent"
android:layout_height= "Fill_parent"
>
<imageview
Android:id= "@+id/icon"
Android:layout_width= "Wrap_content"
android:layout_height= "40px"
android:layout_gravity= "Center"
/>
<textview
Android:id= "@+id/text"
Android:layout_width= "Fill_parent"
android:layout_height= "Wrap_content"
android:gravity= "Center"
Android:textcolor= "#ffffffff"
/>
</LinearLayout>

In this way, our drawer will be finished to see the effect

So much for writing. Drawer This control is very practical, in addition to what I said at the beginning of my application in the program, there are many uses, to play your imagination, the drawer will add a lot to your application.