android UI進(jìn)階之a(chǎn)ndroid中隱藏的layout 抽屜的使用方法
最近在寫(xiě)一個(gè)應(yīng)用,想把設(shè)置頁(yè)面和應(yīng)用頁(yè)面放在一起,這樣就能實(shí)現(xiàn)用戶(hù)可以實(shí)時(shí)看到自己的設(shè)置對(duì)UI的影響,從而更方便的設(shè)置用戶(hù)喜歡的界面。想了一段時(shí)間,發(fā)現(xiàn)用slidingDrawer這個(gè)控件可以實(shí)現(xiàn)這個(gè)效果。也就是一個(gè)抽屜。拉開(kāi)抽屜,占據(jù)半個(gè)屏幕,另外半個(gè)屏幕還是顯示應(yīng)用頁(yè)面。效果還是不錯(cuò)的。
今天就和大家分享一下android中這個(gè)抽屜效果。其實(shí)在android的lanucher就是一個(gè)抽屜,打開(kāi)它就可以看到安裝的應(yīng)用。相信大家都見(jiàn)過(guò)用過(guò)。下面我們就來(lái)做個(gè)相同的效果,當(dāng)然只是UI上差不多相同的效果。
slidingDrawer這個(gè)控件使用非常簡(jiǎn)單,基本在xml里面配置就可以。代碼如下所示。
<?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>
在SlidingDrawer這個(gè)標(biāo)簽下android:handle:指示的就是抽屜的圖片。android:content:指向的就是抽屜里面的布局。有了這個(gè)布局,其實(shí)一個(gè)抽屜就出來(lái)了。
下面我們看Chouti這個(gè)類(lèi)的代碼
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={"瀏覽器","圖片","相機(jī)","時(shí)鐘","音樂(lè)","市場(chǎng)","撥號(hào)","信息","地圖"};
/** Called when the activity is first created. */
@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);//自定義MyAdapter來(lái)實(shí)現(xiàn)圖標(biāo)加item的顯示效果
gv.setAdapter(adapter);
sd.setOnDrawerOpenListener(new SlidingDrawer.OnDrawerOpenListener()//開(kāi)抽屜
{
@Override
public void onDrawerOpened()
{
iv.setImageResource(R.drawable.close1);//響應(yīng)開(kāi)抽屜事件 ,把圖片設(shè)為向下的
}
});
sd.setOnDrawerCloseListener(new SlidingDrawer.OnDrawerCloseListener()
{
@Override
public void onDrawerClosed()
{
iv.setImageResource(R.drawable.open1);//響應(yīng)關(guān)抽屜事件
}
});
}
}
在整個(gè)類(lèi)里面將布局導(dǎo)入,同時(shí)設(shè)置開(kāi)關(guān)抽屜的監(jiān)聽(tīng)事件。這里面我們需要自定義一個(gè)MyAdapter來(lái)顯示帶文字下標(biāo)的圖片。
下面是MyAdapter這個(gè)類(lèi)的代碼
public class MyAdapter extends BaseAdapter
{
private Context _ct;
private String[] _items;
private int[] _icons;
public MyAdapter(Context ct,String[] items,int[] icons) //構(gòu)造器
{
_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);//綁定自定義的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;
}
}
也是非常的簡(jiǎn)單,其中用到的布局如下
<?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>
這樣,我們的抽屜就完成啦 來(lái)看下效果
就寫(xiě)這么多啦。抽屜這個(gè)控件非常實(shí)用,除了我在開(kāi)頭所說(shuō)的我在程序中的應(yīng)用外,還有很多的用途, 發(fā)揮你的想象力,抽屜將為你的應(yīng)用增色不少。
- Android抽屜導(dǎo)航Navigation Drawer實(shí)例解析
- Android實(shí)現(xiàn)自定義滑動(dòng)式抽屜菜單效果
- Android App中DrawerLayout抽屜效果的菜單編寫(xiě)實(shí)例
- Android組件之DrawerLayout實(shí)現(xiàn)抽屜菜單
- Android提高之多方向抽屜實(shí)現(xiàn)方法
- Android控件之SlidingDrawer(滑動(dòng)式抽屜)詳解與實(shí)例分享
- Android SlidingDrawer 抽屜效果的實(shí)現(xiàn)
- Android DrawerLayout帶有側(cè)滑功能的布局類(lèi)(1)
- Android使用DrawerLayout實(shí)現(xiàn)仿QQ雙向側(cè)滑菜單
- Android實(shí)現(xiàn)右邊抽屜Drawerlayout效果
相關(guān)文章
Android使用GridView實(shí)現(xiàn)日歷的簡(jiǎn)單功能
這篇文章主要為大家詳細(xì)介紹了Android使用GridView實(shí)現(xiàn)日歷的簡(jiǎn)單功能,具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2016-12-12android開(kāi)機(jī)自啟動(dòng)原理與實(shí)現(xiàn)案例(附源碼)
完成一下步驟后,啟動(dòng)一次程序,完成注冊(cè)。等下次手機(jī)開(kāi)機(jī)時(shí),該軟件即會(huì)自動(dòng)啟動(dòng),具體實(shí)現(xiàn)如下,感興趣的朋友可以參考下哈2013-06-06Android開(kāi)發(fā)之毛玻璃效果實(shí)例代碼
這篇文章主要給大家分享android開(kāi)發(fā)之毛玻璃效果的實(shí)例代碼,非常具有參考借鑒價(jià)值,感興趣的朋友一起學(xué)習(xí)吧2016-05-05Android實(shí)現(xiàn)在子線(xiàn)程中更新Activity中UI的方法
這篇文章主要介紹了Android實(shí)現(xiàn)在子線(xiàn)程中更新Activity中UI的方法,涉及Android線(xiàn)程與activity操作的相關(guān)技巧,需要的朋友可以參考下2016-04-04android實(shí)現(xiàn)圖片反轉(zhuǎn)效果
這篇文章主要介紹了android實(shí)現(xiàn)圖片反轉(zhuǎn)效果的方法,需要的朋友可以參考下2015-09-09安卓開(kāi)發(fā)之FragmentPagerAdapter和FragmentStatePagerAdapter詳解
這篇文章主要介紹了安卓開(kāi)發(fā)之FragmentPagerAdapter和FragmentStatePagerAdapter詳解的相關(guān)資料,需要的朋友可以參考下2022-08-08使用Android實(shí)現(xiàn)一個(gè)懸浮在軟鍵盤(pán)上的輸入欄
app開(kāi)發(fā)中經(jīng)常會(huì)遇到一些輸入框要懸浮到軟鍵盤(pán)上方的需求,下面這篇文章主要給大家介紹了關(guān)于如何使用Android實(shí)現(xiàn)一個(gè)懸浮在軟鍵盤(pán)上的輸入欄的相關(guān)資料,文中通過(guò)示例代碼介紹的非常詳細(xì),需要的朋友可以參考下2022-04-04Android檢測(cè)手機(jī)多點(diǎn)觸摸點(diǎn)數(shù)的方法
這篇文章主要為大家詳細(xì)介紹了Android檢測(cè)手機(jī)多點(diǎn)觸摸點(diǎn)數(shù)的方法,文中示例代碼介紹的非常詳細(xì),具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2022-05-05