首页 诗词 字典 板报 句子 名言 友答 励志 学校 网站地图
当前位置: 首页 > 教程频道 > 移动开发 > 移动开发 >

让GridView拥有Gallery的拖动效能

2012-08-15 
让GridView拥有Gallery的拖动功能利用Gallery的拖动功能,能很容易的将在一行上显示不下的内容显示出来。这

让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

热点排行