Android自定义控件eBook实现翻书效果实例详解

本文实例讲述了android自定义控件ebook实现翻书效果的方法。分享给大家供大家参考，具体如下：

效果图：

book.java文件：

package com.book;
import android.app.activity;
import android.os.bundle;
import android.util.log;
import android.view.view;
import android.widget.imageview;
public class book extends activity {
  /** called when the activity is first created. */
 ebook mbook;
  public void oncreate(bundle savedinstancestate) {
    super.oncreate(savedinstancestate);
    setcontentview(r.layout.main);
    mbook = (ebook)findviewbyid(r.id.my_book);
    mbook.addlayoutrecforpage(r.layout.page,21);
    mbook.setlistener(new ebook.listener() {
  public void onprevpage() {
  updatecontent();
  }
  public void onnextpage() {
  updatecontent();
  }
  public void oninit() {
  updatecontent();
  }
 });
  }
  private void updatecontent(){
   int index = mbook.getindexforleftpage();
   view left = mbook.getleftpage(),right = mbook.getrightpage();
    view next1 = mbook.getnextpage1(),next2 = mbook.getnextpage2();
    view prev1 = mbook.getprevpage1(),prev2 = mbook.getprevpage2();
    if(left != null)setimg(left,index);
    if(right != null)setimg(right,index+1);
    if(next1 != null)setimg(next1,index+2);
    if(next2 != null)setimg(next2,index+3);
    if(prev1 != null)setimg(prev1,index-1);
    if(prev2 != null)setimg(prev2,index-2);
    mbook.invalidate(); 
  }
 private void setimg(view v , int index){
 if(index >= 0 && index < 20){
  imageview img = (imageview)v.findviewbyid(r.id.book_img);
  if(img == null)return;
  log.d("ebook","set img");
  switch(index%6){
  case 0:
  img.setimageresource(r.drawable.p1);
  break;
  case 1:
  img.setimageresource(r.drawable.p2);
  break;
  case 2:
  img.setimageresource(r.drawable.p3);
  break;
  case 3:
  img.setimageresource(r.drawable.p4);
  break;
  case 4:
  img.setimageresource(r.drawable.p5);
  break;
  case 5:
  img.setimageresource(r.drawable.p6);
  break;
  default:
  break;
  }
 }
 }
}

main.xml文件：

<?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">
 <com.book.ebook android:id="@+id/my_book"
  android:layout_width="fill_parent" 
  android:layout_height="fill_parent"/>
</linearlayout>

page.xml文件：

<?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"
  android:padding="20dip"
  android:background="#ffffdd">
  <imageview android:layout_width="fill_parent" android:id="@+id/book_img"
  android:layout_height="fill_parent" android:layout_weight="1"
  android:scaletype="fitxy" android:src="http://wallage.blog.163.com/blog/@drawable/p1"/>
  <com.book.teledit
  android:id="@+id/book_text"
  android:layout_width="fill_parent"
  android:background="#ffffdd"
  android:gravity="top"
  android:typeface="sans"
  android:capitalize="sentences"
  android:linespacingextra="5dip"
  android:textsize="15dip"
  android:textcolor="#000000"
  android:layout_height="fill_parent"
  android:paddingtop="30dip"
  android:layout_weight="1"/>
</linearlayout>

控件teledit.java代码：

package com.book;
import android.content.context;
import android.graphics.canvas;
import android.graphics.color;
import android.graphics.paint;
import android.util.attributeset;
import android.view.windowmanager;
import android.widget.edittext;
public class teledit extends edittext {
 context mcontext;
 public teledit(context context) {
 super(context);
 mcontext = context;
 }
 public teledit(context context, attributeset attrs) {
 super(context, attrs);
 mcontext = context;
 }
 public teledit(context context, attributeset attrs, int defstyle) {
 super(context, attrs, defstyle);
 mcontext = context;
 }
 protected void ondraw(canvas canvas) {
 windowmanager wm = (windowmanager) mcontext.getsystemservice("window");
 int windowwidth = wm.getdefaultdisplay().getwidth();
 int windowheight = wm.getdefaultdisplay().getheight();
 paint paint = new paint();
 paint.setstyle(paint.style.fill);
 paint.setcolor(color.black);
 int paddingtop = getpaddingtop();
 int paddingbottom = getpaddingbottom();
 int scrolly = getscrolly();
 int scrollx = getscrollx() + windowwidth;
 int innerheight = scrolly + getheight() - paddingbottom;
 int lineheight = getlineheight();
 int baseline = scrolly
  + (lineheight - ((scrolly - paddingtop) % lineheight));
 int x = 8;
 while (baseline < innerheight) {
  canvas.drawline(x, baseline, scrollx - x, baseline, paint);
  baseline += lineheight;
 }
 super.ondraw(canvas);
 }
}

ebook.java文件部分代码：

package com.book;
import java.util.arraylist;
import java.util.date;
import java.util.list;
import android.content.context;
import android.graphics.bitmap;
import android.graphics.canvas;
import android.graphics.color;
import android.graphics.lineargradient;
import android.graphics.paint;
import android.graphics.path;
import android.graphics.point;
import android.graphics.porterduffxfermode;
import android.graphics.shader;
import android.graphics.porterduff.mode;
import android.util.attributeset;
import android.util.log;
import android.view.gesturedetector;
import android.view.layoutinflater;
import android.view.motionevent;
import android.view.view;
import android.view.gesturedetector.ongesturelistener;
import android.widget.framelayout;
import android.widget.linearlayout;
public class ebook extends framelayout{
 public static final string log_tag = "ebook";
 list<integer> myrecpages;
 int totalpagenum;
 context mcontext;
 boolean hasinit = false;
 final int defaultwidth = 600 , defaultheight = 400;
 int contentwidth = 0;
 int contentheight = 0;
 view leftpage,rightpage,llpage,lrpage,rrpage,rlpage;
 linearlayout mview;
 bookview mbookview;
 boolean closebook = false;
 private enum corner {
 lefttop,
 righttop,
 leftbottom,
 rightbottom,
 none
 };
 private corner mselectcorner;
 final int clickcornerlen = 250*250; //50dip
 float scrollx = 0,scrolly = 0;
 int indexpage = 0;
 private enum state {
 about_to_animate,
 animating,
 animate_end,
 ready,
 tracking
 };
 private state mstate;
 private point anistartpos;
 private point anistoppos;
 private date anistarttime;
 private long anitime = 2000;
 private long timeoffset = 900;
 listener mlistener;
 private gesturedetector mgesturedetector;
 private bookongesturelistener mgesturelistener;
 public ebook(context context) {
 super(context);
 init(context);
 }
 public ebook(context context, attributeset attrs) {
 super(context, attrs);
 init(context);
 }
...省略
}

该控件大致实现方法：

ebook继承framelayout，好处在于framelayout有图层效果，后添加的view类能覆盖前面的view。

初始化：定义一个linearlayout的成员变量mview，将page.xml inflate 成view分别用leftpage，rightpage引用，并初始化其数据，将leftpage，rightpage通过addview添加到mview，然后将mview添加到ebook。在ebook里定义一个私有类bookview extends view。 并定义成员变量 bookview mbookview； 最后将mbookview添加的ebook中，这样，mview中的内容为书面内容，mbookview中的内容为特效内容。

后续手势动作：可将各种手势的特效动作画于mbookview的画布中。

更多关于android相关内容感兴趣的读者可查看本站专题：《android图形与图像处理技巧总结》、《android开发入门与进阶教程》、《android调试技巧与常见问题解决方法汇总》、《android多媒体操作技巧汇总(音频,视频,录音等)》、《android基本组件用法总结》、《android视图view技巧总结》、《android布局layout技巧总结》及《android控件用法总结》

希望本文所述对大家android程序设计有所帮助。