L迁客

技术博客
随笔 - 1, 文章 - 12, 评论 - 1, 引用 - 0
数据加载中……

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="@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>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分别用leftPagerightPage引用,并初始化其数据,将leftPagerightPage通过addView添加到mView,然后将mView添加到eBook。在eBook里定义一个私有类BookView extends View 并定义成员变量 BookView mBookView 最后将mBookView添加的eBook中,这样,mView中的内容为书面内容,mBookView中的内容为特效内容。

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

效果图, 效果, Android, activity, created

posted on 2013-02-24 16:40 L迁客 阅读(84) 评论(0)  编辑  收藏


只有注册用户登录后才能发表评论。


网站导航: