让GridView拥有Gallery的拖动功能

利用Gallery的拖动功能,能很容易的将在一行上显示不下的内容显示出来。

这种特性可以用在菜单上(如果菜单足够多,以至一行显示不下)。

但是Gallery有个不爽的地方,就是被点击的那个item会一直出现在中间,有时候我们并不需要这样的“智能”!怎么办呢?

那就利用GridView,将GridView放在HorizontalScrollView中,如下:

Xml代码收藏代码

1.<?xmlversion="1.0"encoding="utf-8"?>

2.<LinearLayoutxmlns:android="http://schemas.android.com/apk/res/android"

3.android:orientation="vertical"

4.android:layout_width="fill_parent"

5.android:layout_height="fill_parent">

6.

7.<RelativeLayoutandroid:background="#030e13"

8.android:layout_width="fill_parent"

9.android:layout_height="wrap_content"

10.>

11.<ImageViewandroid:id="@+id/webnav_left"

12.android:layout_width="8dip"

13.android:layout_height="wrap_content"

14.android:layout_centerVertical="true"

15.android:src="@drawable/news_left"

16./>

17.<ImageViewandroid:id="@+id/webnav_right"

18.android:layout_width="8dip"

19.android:layout_height="wrap_content"

20.android:layout_alignParentRight="true"

21.android:layout_centerVertical="true"

22.android:src="@drawable/news_right"

23./>

24.<HorizontalScrollViewandroid:layout_width="fill_parent"

25.android:layout_height="wrap_content"

26.android:layout_toLeftOf="@id/webnav_right"

27.android:layout_toRightOf="@id/webnav_left"

28.android:scrollbars="none">

29.<LinearLayoutandroid:layout_width="fill_parent"

30.android:layout_height="wrap_content">

31.<LinearLayoutandroid:id="@+id/layout_webnav"

32.android:layout_width="800dip"

33.android:layout_height="wrap_content"

34.android:orientation="horizontal">

35.<GridViewandroid:id="@+id/gallery_webnav"

36.android:layout_width="fill_parent"

37.android:layout_height="fill_parent"

38.android:background="#030e13"

39.android:gravity="center"

40.android:numColumns="auto_fit"

41.android:listSelector="#00000000">

42.</GridView>

43.</LinearLayout>

44.</LinearLayout>

45.</HorizontalScrollView>

46.</RelativeLayout>

47.

48.</LinearLayout>

<?xmlversion="1.0"encoding="utf-8"?>

<LinearLayoutxmlns:android="http://schemas.android.com/apk/res/android"

android:orientation="vertical"

android:layout_width="fill_parent"

android:layout_height="fill_parent">

<RelativeLayoutandroid:background="#030e13"

android:layout_width="fill_parent"

android:layout_height="wrap_content"

>

<ImageViewandroid:id="@+id/webnav_left"

android:layout_width="8dip"

android:layout_height="wrap_content"

android:layout_centerVertical="true"

android:src="@drawable/news_left"

/>

<ImageViewandroid:id="@+id/webnav_right"

android:layout_width="8dip"

android:layout_height="wrap_content"

android:layout_alignParentRight="true"

android:layout_centerVertical="true"

android:src="@drawable/news_right"

/>

<HorizontalScrollViewandroid:layout_width="fill_parent"

android:layout_height="wrap_content"

android:layout_toLeftOf="@id/webnav_right"

android:layout_toRightOf="@id/webnav_left"

android:scrollbars="none">

<LinearLayoutandroid:layout_width="fill_parent"

android:layout_height="wrap_content">

<LinearLayoutandroid:id="@+id/layout_webnav"

android:layout_width="800dip"

android:layout_height="wrap_content"

android:orientation="horizontal">

<GridViewandroid:id="@+id/gallery_webnav"

android:layout_width="fill_parent"

android:layout_height="fill_parent"

android:background="#030e13"

android:gravity="center"

android:numColumns="auto_fit"

android:listSelector="#00000000">

</GridView>

</LinearLayout>

</LinearLayout>

</HorizontalScrollView>

</RelativeLayout>

</LinearLayout>

注意上面id为layout_webnav的LinearLayout,这里的layout_width是需要计算的!见下面代码。

Java代码收藏代码

1.publicclassTest_2_ActivityextendsActivity{

2.

3.privatefinalintper=3;//每行显示的个数

4.privateGridViewgridView;

5.@Override

6.publicvoidonCreate(BundlesavedInstanceState){

7.super.onCreate(savedInstanceState);

8.setContentView(R.layout.test2);

9.DisplayMetricsdm=newDisplayMetrics();

10.dm=getApplicationContext().getResources().getDisplayMetrics();

11.intmenuWidth=dm.widthPixels-16;

12.

13.gridView=(GridView)findViewById(R.id.gallery_webnav);

14.intitemWidth=menuWidth/per;

15.gridView.setColumnWidth(itemWidth);

16.

17.ArrayList<Map<String,String>>data=newArrayList<Map<String,String>>();

18.Map<String,String>map;

19.for(inti=0;i<5;i++){

20.map=newHashMap<String,String>();

21.map.put("simple_item_1","name"+i);

22.map.put("simple_item_2","age"+i);

23.map.put("simple_item_3","class"+i);

24.data.add(map);

25.}

26.intresource=R.layout.row_test2;

27.String[]from={"simple_item_1","simple_item_2","simple_item_3"};

28.int[]to={R.id.simple_item_1,R.id.simple_item_2,R.id.simple_item_3};

29.SimpleAdapteradapter=newSimpleAdapter(this,data,resource,from,to);

30.

31.gridView.setAdapter(adapter);

32.

33.//让GridView一行显示,这里的layout_width是需要计算的

34.LinearLayoutlayout=(LinearLayout)findViewById(R.id.layout_webnav);

35.layout.setLayoutParams(newLayoutParams(itemWidth*data.size(),LayoutParams.WRAP_CONTENT));

36.

37.gridView.setSelection(0);

38.gridView.setOnItemClickListener(listener);

39.}

40.}

publicclassTest_2_ActivityextendsActivity{

privatefinalintper=3;//每行显示的个数

privateGridViewgridView;

@Override

publicvoidonCreate(BundlesavedInstanceState){

super.onCreate(savedInstanceState);

setContentView(R.layout.test2);

DisplayMetricsdm=newDisplayMetrics();

dm=getApplicationContext().getResources().getDisplayMetrics();

intmenuWidth=dm.widthPixels-16;

gridView=(GridView)findViewById(R.id.gallery_webnav);

intitemWidth=menuWidth/per;

gridView.setColumnWidth(itemWidth);

ArrayList<Map<String,String>>data=newArrayList<Map<String,String>>();

Map<String,String>map;

for(inti=0;i<5;i++){

map=newHashMap<String,String>();

map.put("simple_item_1","name"+i);

map.put("simple_item_2","age"+i);

map.put("simple_item_3","class"+i);

data.add(map);

}

intresource=R.layout.row_test2;

String[]from={"simple_item_1","simple_item_2","simple_item_3"};

int[]to={R.id.simple_item_1,R.id.simple_item_2,R.id.simple_item_3};

SimpleAdapteradapter=newSimpleAdapter(this,data,resource,from,to);

gridView.setAdapter(adapter);

//让GridView一行显示,这里的layout_width是需要计算的

LinearLayoutlayout=(LinearLayout)findViewById(R.id.layout_webnav);

layout.setLayoutParams(newLayoutParams(itemWidth*data.size(),LayoutParams.WRAP_CONTENT));

gridView.setSelection(0);

gridView.setOnItemClickListener(listener);

}

}

注意上面的itemWidth*data.size(),这里才是LinearLayout的实际宽度!

R.layout.row_test2布局如下:

Xml代码收藏代码

1.<?xmlversion="1.0"encoding="utf-8"?>

2.<LinearLayoutxmlns:android="http://schemas.android.com/apk/res/android"

3.android:orientation="vertical"

4.android:layout_width="fill_parent"

5.android:layout_height="fill_parent"

6.>

7.<TextViewandroid:id="@+id/simple_item_1"

8.android:layout_width="fill_parent"

9.android:layout_height="fill_parent"

10.android:gravity="center"

11./>

12.<RelativeLayoutandroid:background="#030e13"

13.android:layout_width="fill_parent"

14.android:layout_height="fill_parent"

15.>

16.<TextViewandroid:id="@+id/simple_item_2"

17.android:layout_width="wrap_content"

18.android:layout_height="wrap_content"

19.android:layout_alignParentLeft="true"

20.android:paddingLeft="10dp"

21./>

22.<TextViewandroid:id="@+id/simple_item_3"

23.android:layout_width="wrap_content"

24.android:layout_height="wrap_content"

25.android:layout_alignParentRight="true"

26.android:paddingRight="10dp"

27./>

28.</RelativeLayout>

29.</LinearLayout>

<?xmlversion="1.0"encoding="utf-8"?>

<LinearLayoutxmlns:android="http://schemas.android.com/apk/res/android"

android:orientation="vertical"

android:layout_width="fill_parent"

android:layout_height="fill_parent"

>

<TextViewandroid:id="@+id/simple_item_1"

android:layout_width="fill_parent"

android:layout_height="fill_parent"

android:gravity="center"

/>

<RelativeLayoutandroid:background="#030e13"

android:layout_width="fill_parent"

android:layout_height="fill_parent"

>

<TextViewandroid:id="@+id/simple_item_2"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:layout_alignParentLeft="true"

android:paddingLeft="10dp"

/>

<TextViewandroid:id="@+id/simple_item_3"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:layout_alignParentRight="true"

android:paddingRight="10dp"

/>

</RelativeLayout>

</LinearLayout>

运行后显示的效果:

看不出什么,呵呵,拖动一下看看。

gundumw100

相关推荐