让GridView拥有Gallery的拖动功能
利用Gallery的拖动功能,能很容易的将在一行上显示不下的内容显示出来。
这种特性可以用在菜单上(如果菜单足够多,以至一行显示不下)。
但是Gallery有个不爽的地方,就是被点击的那个item会一直出现在中间,有时候我们并不需要这样的“智能”!怎么办呢?
那就利用GridView,将GridView放在HorizontalScrollView中,如下:
Xml代码 收藏代码
1. <?xml version="1.0" encoding="utf-8"?>
2. <LinearLayout xmlns: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. <RelativeLayout android:background="#030e13"
8. android:layout_width="fill_parent"
9. android:layout_height="wrap_content"
10. >
11. <ImageView android: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. <ImageView android: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. <HorizontalScrollView android: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. <LinearLayout android:layout_width="fill_parent"
30. android:layout_height="wrap_content">
31. <LinearLayout android:id="@+id/layout_webnav"
32. android:layout_width="800dip"
33. android:layout_height="wrap_content"
34. android:orientation="horizontal">
35. <GridView android: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>
<?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">
<RelativeLayout android:background="#030e13"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
>
<ImageView android:id="@+id/webnav_left"
android:layout_width="8dip"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:src="@drawable/news_left"
/>
<ImageView android: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"
/>
<HorizontalScrollView android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_toLeftOf="@id/webnav_right"
android:layout_toRightOf="@id/webnav_left"
android:scrollbars="none">
<LinearLayout android:layout_width="fill_parent"
android:layout_height="wrap_content">
<LinearLayout android:id="@+id/layout_webnav"
android:layout_width="800dip"
android:layout_height="wrap_content"
android:orientation="horizontal">
<GridView android: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. public class Test_2_Activity extends Activity{
2.
3. private final int per=3;//每行显示的个数
4. private GridView gridView;
5. @Override
6. public void onCreate(Bundle savedInstanceState) {
7. super.onCreate(savedInstanceState);
8. setContentView(R.layout.test2);
9. DisplayMetrics dm = new DisplayMetrics();
10. dm = getApplicationContext().getResources().getDisplayMetrics();
11. int menuWidth = dm.widthPixels-16;
12.
13. gridView= (GridView) findViewById(R.id.gallery_webnav);
14. int itemWidth = menuWidth/per;
15. gridView.setColumnWidth(itemWidth);
16.
17. ArrayList<Map<String,String>> data=new ArrayList<Map<String,String>>();
18. Map<String,String> map;
19. for(int i=0;i<5;i++){
20. map=new HashMap<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. int resource=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. SimpleAdapter adapter=new SimpleAdapter(this, data, resource, from, to);
30.
31. gridView.setAdapter(adapter);
32.
33. //让GridView一行显示,这里的layout_width是需要计算的
34. LinearLayout layout = (LinearLayout) findViewById(R.id.layout_webnav);
35. layout.setLayoutParams(new LayoutParams(itemWidth*data.size(), LayoutParams.WRAP_CONTENT));
36.
37. gridView.setSelection(0);
38. gridView.setOnItemClickListener(listener);
39. }
40. }
public class Test_2_Activity extends Activity{
private final int per=3;//每行显示的个数
private GridView gridView;
@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.test2);
DisplayMetrics dm = new DisplayMetrics();
dm = getApplicationContext().getResources().getDisplayMetrics();
int menuWidth = dm.widthPixels-16;
gridView= (GridView) findViewById(R.id.gallery_webnav);
int itemWidth = menuWidth/per;
gridView.setColumnWidth(itemWidth);
ArrayList<Map<String,String>> data=new ArrayList<Map<String,String>>();
Map<String,String> map;
for(int i=0;i<5;i++){
map=new HashMap<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);
}
int resource=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};
SimpleAdapter adapter=new SimpleAdapter(this, data, resource, from, to);
gridView.setAdapter(adapter);
//让GridView一行显示,这里的layout_width是需要计算的
LinearLayout layout = (LinearLayout) findViewById(R.id.layout_webnav);
layout.setLayoutParams(new LayoutParams(itemWidth*data.size(), LayoutParams.WRAP_CONTENT));
gridView.setSelection(0);
gridView.setOnItemClickListener(listener);
}
}
注意上面的itemWidth*data.size(),这里才是LinearLayout的实际宽度!
R.layout.row_test2布局如下:
Xml代码 收藏代码
1. <?xml version="1.0" encoding="utf-8"?>
2. <LinearLayout xmlns: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. <TextView android:id="@+id/simple_item_1"
8. android:layout_width="fill_parent"
9. android:layout_height="fill_parent"
10. android:gravity="center"
11. />
12. <RelativeLayout android:background="#030e13"
13. android:layout_width="fill_parent"
14. android:layout_height="fill_parent"
15. >
16. <TextView android: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. <TextView android: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>
<?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"
>
<TextView android:id="@+id/simple_item_1"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:gravity="center"
/>
<RelativeLayout android:background="#030e13"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
>
<TextView android:id="@+id/simple_item_2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:paddingLeft="10dp"
/>
<TextView android: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