android書架效果

            以前也模仿者ireader實現了書架的效果，但是那種是使用listview實現的，並不好用。絕大多數都是用gridview實現的，網上這方面資料比較少，有些開源的電子書都是重點做了閱讀，並沒有像ireader和QQ閱讀這樣的書架效果。

           書架這種效果我早就實現了，本來想做一個完美的電子書，但是因為自己的懶惰，僅僅持續了一兩天，今天又找到了以前的代碼分享出來，希望大家能一起實現一個比較完美的開源的電子書。廢話不多說先看下效果：

       

    本地部分還沒有做，做好以後就可以吧本地的書載入到書架裡了，這隻是一個開始，後面還有很多複雜的沒有做。

     下面先看一下書架的實現原理吧！

       首先看一下layout下的布局檔案main.xml

   

<?xml version="1.0" encoding="utf-8"?><RelativeLayoutxmlns:android="http://schemas.android.com/apk/res/android"android:orientation="vertical"android:layout_width="fill_parent"android:layout_height="fill_parent"><include layout="@layout/head" android:id="@+id/head"/><cn.com.karl.view.MyGridView    android:id="@+id/bookShelf"    android:layout_width="fill_parent"    android:layout_height="fill_parent"    android:layout_below="@id/head"    android:cacheColorHint="#00000000"    android:columnWidth="90.0dip"    android:fadingEdge="none"    android:horizontalSpacing="5dp"    android:listSelector="#00000000"    android:numColumns="3"    android:scrollbars="none"    android:verticalSpacing="20dp" />   <SlidingDrawer          android:id="@+id/sliding"          android:layout_width="match_parent"          android:layout_height="match_parent"          android:content="@+id/allApps"          android:handle="@+id/imageViewIcon"          android:orientation="vertical" >                         <Button              android:id="@+id/imageViewIcon"              android:layout_width="wrap_content"              android:layout_height="wrap_content"              android:text="本地"            android:textSize="18dp"            android:background="@drawable/btn_local" />                      <GridView              android:id="@+id/allApps"              android:layout_width="wrap_content"              android:layout_height="wrap_content"              android:background="@drawable/file_list_bg"              android:columnWidth="60dp"              android:gravity="center"              android:horizontalSpacing="10dp"              android:numColumns="auto_fit"              android:padding="10dp"              android:stretchMode="columnWidth"              android:verticalSpacing="10dp" />                    </SlidingDrawer>    </RelativeLayout>

     上面是個自訂的gridview主要來實現書架，因為每一本書是一個item，在自訂的gridview中計算每一行的高度，然後把書架畫上去。下面是個抽屜。

    

public class MyGridView extends GridView {private Bitmap background;public MyGridView(Context context, AttributeSet attrs) {super(context, attrs);background = BitmapFactory.decodeResource(getResources(),R.drawable.bookshelf_layer_center);}@Overrideprotected void dispatchDraw(Canvas canvas) {int count = getChildCount();int top = count > 0 ? getChildAt(0).getTop() : 0;int backgroundWidth = background.getWidth();int backgroundHeight = background.getHeight()+2;int width = getWidth();int height = getHeight();for (int y = top; y < height; y += backgroundHeight) {for (int x = 0; x < width; x += backgroundWidth) {canvas.drawBitmap(background, x, y, null);}}super.dispatchDraw(canvas);}}

    上面就是自訂書架的gridview，也是實現書架最核心的方法。

    然後是每一個item的布局：

   

<?xml version="1.0" encoding="utf-8"?><LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"    android:layout_width="fill_parent"    android:layout_height="fill_parent"    android:gravity="center"    android:orientation="vertical" >    <TextView    android:layout_height="110dp"android:layout_width="90dp"android:layout_marginTop="10dp"android:background="@drawable/cover_txt"android:id="@+id/imageView1"android:text="天龍八部"android:padding="15dp"android:textColor="#000000"    /></LinearLayout>

      最後就可以在主activity中顯示出來了。

  

public class BookShelfActivity extends BaseActivity {    private GridView bookShelf;    private int[] data = {R.drawable.cover_txt,R.drawable.cover_txt,R.drawable.cover_txt,R.drawable.cover_txt,R.drawable.cover_txt,R.drawable.cover_txt,R.drawable.cover_txt,R.drawable.cover_txt,R.drawable.cover_txt,R.drawable.cover_txt,R.drawable.cover_txt,R.drawable.cover_txt,R.drawable.cover_txt,R.drawable.cover_txt,R.drawable.cover_txt,R.drawable.cover_txt,R.drawable.cover_txt,R.drawable.cover_txt,R.drawable.cover_txt,R.drawable.cover_txt,R.drawable.cover_txt,R.drawable.cover_txt,R.drawable.cover_txt,R.drawable.cover_txt,R.drawable.cover_txt,R.drawable.cover_txt,R.drawable.cover_txt,R.drawable.cover_txt,R.drawable.cover_txt,R.drawable.cover_txt,R.drawable.cover_txt,R.drawable.cover_txt,R.drawable.cover_txt,R.drawable.cover_txt};    private String[] name={    "天龍八部","搜神記","水滸傳","黑道悲情"    };        private GridView gv;      private SlidingDrawer sd;      private Button iv;      private List<ResolveInfo> apps;      /** Called when the activity is first created. */    @Override    public void onCreate(Bundle savedInstanceState) {        super.onCreate(savedInstanceState);        this.requestWindowFeature(Window.FEATURE_NO_TITLE);        setContentView(R.layout.main);                bookShelf = (GridView) findViewById(R.id.bookShelf);        ShlefAdapter adapter=new ShlefAdapter();        bookShelf.setAdapter(adapter);        bookShelf.setOnItemClickListener(new OnItemClickListener() {@Overridepublic void onItemClick(AdapterView<?> arg0, View arg1, int arg2,long arg3) {// TODO Auto-generated method stubif(arg2>=data.length){}else{   Toast.makeText(getApplicationContext(), ""+arg2, Toast.LENGTH_SHORT).show();}}});        loadApps();          gv = (GridView) findViewById(R.id.allApps);          sd = (SlidingDrawer) findViewById(R.id.sliding);          iv = (Button) findViewById(R.id.imageViewIcon);          gv.setAdapter(new GridAdapter());          sd.setOnDrawerOpenListener(new SlidingDrawer.OnDrawerOpenListener()// 開抽屜          {              @Override              public void onDrawerOpened() {              iv.setText("返回");                iv.setBackgroundResource(R.drawable.btn_local);// 響應開抽屜事件                                                                  // ，把圖片設為向下的              }          });          sd.setOnDrawerCloseListener(new SlidingDrawer.OnDrawerCloseListener() {              @Override              public void onDrawerClosed() {              iv.setText("本地");                iv.setBackgroundResource(R.drawable.btn_local);// 響應關抽屜事件              }          });      }    class ShlefAdapter extends BaseAdapter{@Overridepublic int getCount() {// TODO Auto-generated method stubreturn data.length+5;}@Overridepublic Object getItem(int arg0) {// TODO Auto-generated method stubreturn arg0;}@Overridepublic long getItemId(int arg0) {// TODO Auto-generated method stubreturn arg0;}@Overridepublic View getView(int position, View contentView, ViewGroup arg2) {// TODO Auto-generated method stubcontentView=LayoutInflater.from(getApplicationContext()).inflate(R.layout.item1, null);TextView view=(TextView) contentView.findViewById(R.id.imageView1);if(data.length>position){if(position<name.length){   view.setText(name[position]);}view.setBackgroundResource(data[position]);}else{view.setBackgroundResource(data[0]);view.setClickable(false);view.setVisibility(View.INVISIBLE);}return contentView;}        }    @Overridepublic boolean onKeyDown(int keyCode, KeyEvent event) {// TODO Auto-generated method stubif (keyCode == KeyEvent.KEYCODE_BACK) {AlertDialog.Builder builder = new AlertDialog.Builder(this);builder.setMessage("你確定退出嗎？").setCancelable(false).setPositiveButton("確定",new DialogInterface.OnClickListener() {public void onClick(DialogInterface dialog,int id) {finish();}}).setNegativeButton("返回",new DialogInterface.OnClickListener() {public void onClick(DialogInterface dialog,int id) {dialog.cancel();}});AlertDialog alert = builder.create();alert.show();return true;}return super.onKeyDown(keyCode, event);}            private void loadApps() {          Intent intent = new Intent(Intent.ACTION_MAIN, null);          intent.addCategory(Intent.CATEGORY_LAUNCHER);            apps = getPackageManager().queryIntentActivities(intent, 0);      }        public class GridAdapter extends BaseAdapter {          public GridAdapter() {            }            public int getCount() {              // TODO Auto-generated method stub              return apps.size();          }            public Object getItem(int position) {              // TODO Auto-generated method stub              return apps.get(position);          }            public long getItemId(int position) {              // TODO Auto-generated method stub              return position;          }            public View getView(int position, View convertView, ViewGroup parent) {              // TODO Auto-generated method stub              ImageView imageView = null;              if (convertView == null) {                  imageView = new ImageView(BookShelfActivity.this);                  imageView.setScaleType(ImageView.ScaleType.FIT_CENTER);                  imageView.setLayoutParams(new GridView.LayoutParams(50, 50));              } else {                  imageView = (ImageView) convertView;              }                ResolveInfo ri = apps.get(position);              imageView.setImageDrawable(ri.activityInfo                      .loadIcon(getPackageManager()));                return imageView;          }        }  }

    代碼寫的有點亂，有待整理下，哈哈。
    上面只是一個畫龍點睛的作用，真要實現一個好的電子書，後面還有跟多的工作，也希望有興趣的朋友能在此基礎上實現一個完美的電子書，然後把原始碼開放，這樣我就不用在往下做了，嘎嘎。

    最後附上源碼：點擊開啟連結