Android开发当中,尤其是在做电子书等方面的项目时,难免会遇到翻书效果的使用。下面就来讲解下,实现翻书效果的实例。
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的画布中。
Java代码:
package eoe.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;
}
}
}
}
我们在来看看xml代码:
java代码:
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>
控件TelEdit.java代码:
java代码:
package eoe.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文件部分代码:
java代码:
package eoe.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的画布中。
Java代码:
package eoe.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;
}
}
}
}
我们在来看看xml代码:
java代码:
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>
控件TelEdit.java代码:
java代码:
package eoe.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文件部分代码:
java代码:
package eoe.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);
}
}
相关推荐
在Android开发中,实现引人入胜的用户体验是至关重要的,而翻页动画效果就是其中一种可以提升用户交互感的视觉技巧。本实例代码着重展示了如何在Android平台上创建逼真的翻页动画,使得应用程序看起来更加生动有趣。...
在Android开发中,实现横向滑动翻页效果是构建用户界面的一个常见需求,尤其是在创建类似于电子书、图片浏览器或者卡片式布局的应用时。本实例将深入讲解如何在Android项目中实现这种效果,主要涉及的技术点包括...
在Android开发中,为了提升用户体验,开发者经常会在应用程序中加入一些交互特效,其中“翻书效果”就是一种很受欢迎的视觉体验。本文将详细介绍如何在Android应用中实现翻页效果,重点介绍使用`ViewFlipper`和`...
在Android开发中,实现“翻书效果”是一种增强用户体验、为应用程序增添互动性的技术。这种效果通常用于电子书籍(eBook)应用,模仿真实的纸质书翻页动作,给用户带来更真实的阅读体验。以下是如何在Android中实现...
在Android开发中,实现书籍的层叠翻页动画效果是一项常见的需求,特别是在设计电子阅读应用时,这样的平滑翻页体验能极大地提升用户的阅读感受。本文将深入探讨如何利用Android SDK中的工具和技术来创建这样的动画...
在Android开发中,实现书籍翻页效果是一种常见的增强用户体验的方式,尤其在电子阅读应用或教育类应用中。这个"Android 书籍翻页效果的demo.zip"包含了一个示例项目,展示了如何在Android平台上创建逼真的翻页动画。...
在Android应用开发中,创建吸引用户的交互体验是至关重要的,其中书籍翻页效果就是一个常见的亮点。这个"Android书籍翻页效果的demo"提供了一个实现逼真翻页效果的实例,适用于电子书应用或者任何需要类似动态展示...
在Android开发中,实现翻页效果是常见的需求,可以用于电子书阅读器、日历应用或者展示多张图片等场景。本压缩包包含两个实际运行的翻页效果实例,可以帮助开发者深入理解并实践这一功能。 首先,我们来看"turntest...
Android移动开发实例包002是学习Android开发的利器,包含:1、条形码、二维码扫描、生成Demo 2、android-整体UI设计-滑动导航栏+滚动页面 3、CityWeather 4、FileManager 5、MobileMap 6、MusicPlayer 7、MyContacts...
在Android开发中,滑动效果和华丽的翻页效果是提升用户体验的重要手段,尤其是在阅读类、杂志类或者图片展示类应用中。"Pager"通常指的是Android的ViewPager组件,它是实现页面滑动效果的核心工具。本篇文章将深入...
在Android开发中,翻页效果是一种常见的用户界面交互设计,它可以提供流畅且吸引人的用户体验,尤其是在展示内容列表或页面切换时。"android翻页效果扩展版"是一个专门针对这一需求的实现,它提供了更丰富的功能和...
在Android应用开发中,仿真翻页效果是一种常见的交互设计,它可以为用户带来更生动、更具沉浸感的体验。本项目提供了实现这一效果的源码,适用于开发者参考和学习。在这个项目中,我们将深入探讨Android仿真翻页效果...
它可以帮助开发者将理论知识转化为实践,加深对Android开发的理解。 总之,"Android应用源码之android 仿真翻页效果"涵盖了Android应用开发中的多个关键领域,包括UI设计、动画实现、手势识别和性能优化。通过研究...
在Android开发中,有时我们需要创建独特且吸引用户的交互体验,比如动态的翻页效果。"android flipView 分数上下翻页效果控件"就是一个这样的实现,它模仿了GitHub上的开源项目,为Android应用提供了分数展示的上下...
总之,"android手势翻页效果"是Android开发中提升用户体验的一种重要技术,通过理解和运用`GestureDetector`, `Scroller`以及`VelocityTracker`,开发者可以创造出更生动、自然的用户界面。这个小例子对于深入理解...
在Android应用开发中,动画效果是提升用户体验的重要手段之一,特别是在阅读类应用中,书本翻页效果可以带给用户更为真实、沉浸式的阅读体验。本文将深入探讨如何实现这样一个"Android翻页动画效果",并介绍如何将其...
在Android开发中,横向翻图效果通常用于实现类似相册或滚动浏览图片的功能。这种效果可以给用户带来流畅且自然的交互体验。本实例将深入探讨如何在Android应用中实现这样的功能。 首先,我们需要理解Android的...
本示例源码“Android程序研发源码Android 书籍翻页效果的demo”提供了一个实现此类效果的实例。接下来,我们将深入探讨这个Demo中涉及的关键知识点。 1. **Page Flip Animation(翻页动画)**: - 在Android中,...
在Android应用开发中,翻页效果是一种常见的交互设计,它为用户提供了一种平滑而直观的浏览体验。本文将深入探讨如何实现Android的翻页效果,主要基于标题"android翻页效果代码"和描述中提到的实例。 首先,翻页...