Android杂志架

时间:2012-06-28 12:43:41

标签: android android-ui

我必须创建一个应用程序的UI作为存放杂志的书架。我使用自定义网格视图,网格元素由杂志的缩略图组成,有架子作为背景图像。

shelf.xml

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
        android:id="@+id/linearLayout1"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent" >

        <GridView
            android:id="@+id/gridView1"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:numColumns="4" >
        </GridView>

    </LinearLayout>

item.xml

  <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
        android:id="@+id/linearLayout1"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent" 
        android:background="@drawable/grid">

        <ImageView
            android:id="@+id/imageView1"
            android:layout_width="70dp"
            android:layout_height="100dp"
            android:layout_alignParentBottom="true"
            android:layout_centerHorizontal="true"
            android:layout_marginBottom="41dp"
            android:src="@drawable/book1" />

    </RelativeLayout>

LibraryActivity.java

public class LibraryActivity extends Activity {

    GridView grid = null;
    ArrayList<Integer> image = new ArrayList<Integer>();
    ImageView thumbnail;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        // TODO Auto-generated method stub
        super.onCreate(savedInstanceState);
        setContentView(R.layout.shelf);
        image.add(R.drawable.book1);
        image.add(R.drawable.book2);
        image.add(R.drawable.book3);
        image.add(R.drawable.book4);

        System.out.println("before adapter");
        grid = (GridView) findViewById(R.id.gridView1);
        CustomAdapter adapter = new CustomAdapter(this, R.layout.item);
        grid.setAdapter(adapter);
    }

    public class CustomAdapter extends BaseAdapter {

        Context mContext = null;
        int mitem = 0;
        LayoutInflater mInflater = null;

        public CustomAdapter(Context context, int item) {

            this.mContext = context;
            this.mitem = item;
            this.mInflater = (LayoutInflater) context
                    .getSystemService(LAYOUT_INFLATER_SERVICE);

        }

        @Override
        public int getCount() {
            // TODO Auto-generated method stub
            return image.size();
        }

        @Override
        public Object getItem(int position) {
            // TODO Auto-generated method stub
            return null;
        }

        @Override
        public long getItemId(int position) {
            // TODO Auto-generated method stub
            return 0;
        }

        @Override
        public View getView(int position, View convertView, ViewGroup parent) {

            if (convertView == null) {

                System.out.println("****CHECKING 2**********");
                convertView = mInflater.inflate(mitem, null);
                System.out.println("****CHECKING 3**********");
                thumbnail = (ImageView) convertView
                        .findViewById(R.id.imageView1);
                System.out.println("****CHECKING 3**********");

            }

            thumbnail.setImageResource(image.get(position));

            return convertView;
        }

    }

}

但是使用此代码只显示带杂志的书架。我想显示空架子占据设备的整个屏幕。我怎样才能做到这一点?? 有没有其他方法来实现货架?

1 个答案:

答案 0 :(得分:2)

Google的Romain Guy制作了一个名为Shelves的精彩项目。你应该看看它。