Page Curl Animation in android?
Can anybody have idea about that implementing curling effect for the views or layout. I searched a lot of things about it, but i can't get any idea. I refer this following links
https://github.com/harism/android_page_curl
http://code.google.com/p/android-page-curl/
But both links are used to give effects to images only.I tried with harism code, i just create one layout and convert into bitmap after i displaying it.It is succeeded for me.But it doesnt works like a view. Means that just a static page (with no scrollbars if text size exceeded). Please suggest me regarding this if any ideas.
public class CurlActivity extends Activity {
private CurlView mCurlView;
private BitmapDrawable[] bmp = new BitmapDrawable[7];
@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.main);
int index = 0;
if (getLastNonConfigurationInstance() != null) {
index = (Integer) getLastNonConfigurationInstance();
}
mCurlView = (CurlView) findViewById(R.id.curl);
mCurlView.setPageProvider(new PageProvider());
mCurlView.setSizeChangedObserver(new SizeChangedObserver());
mCurlView.setCurrentIndex(index);
mCurlView.setBackgroundColor(0xFF202830);
for (int i = 0; i < bmp.length; i++) {
bmp[0] = (BitmapDrawable) getResources().getDrawable(
R.drawable.obama);
bmp[1] = (BitmapDrawable) getResources().getDrawable(
R.drawable.road_rage);
if (i < 2)
continue;
TextView b = new TextView(this);
b.setLayoutParams(new LayoutParams(480, 854));
b.setText("page " + i);
b.setTextSize(TypedValue.COMPLEX_UNIT_DIP, 18);
b.setTextColor(Color.BLACK);
b.setBackgroundColor(Color.WHITE);
bmp[i] = new BitmapDrawable(loadBitmapFromView(b));
}
// This is something somewhat experimental. Before uncommenting next
// line, please see method comments in CurlView.
// mCurlView.setEnableTouchPressure(true);
}
public static Bitmap loadBitmapFromView(View v) {
Bitmap b = Bitmap.createBitmap(v.getLayoutParams().width,
v.getLayoutParams().height, Bitmap.Config.ARGB_8888);
Canvas c = new Canvas(b);
v.layout(0, 0, v.getLayoutParams().width, v.getLayoutParams().height);
v.draw(c);
return b;
}
@Override
public void onPause() {
super.onPause();
mCurlView.onPause();
}
@Override
public void onResume() {
super.onResume();
mCurlView.onResume();
}
@Override
public Object onRetainNonConfigurationInstance() {
return mCurlView.getCurrentIndex();
}
/**
* Bitmap provider.
*/
private class PageProvider implements CurlView.PageProvider {
// Bitmap resources.
// private int[] mBitmapIds = { R.drawable.obama, R.drawable.road_rage,
// R.drawable.taipei_101, R.drawable.world };
@Override
public int getPageCount() {
return 7;
}
private Bitmap loadBitmap(int width, int height, int index) {
Bitmap b = Bitmap.createBitmap(width, height,
Bitmap.Config.ARGB_8888);
b.eraseColor(0xFFFFFFFF);
Canvas c = new Canvas(b);
Drawable d = bmp[index];
// Drawable d = getResources().getDrawable(mBitmapIds[index]);
int margin = 5;
int border = 3;
Rect r = new Rect(margin, margin, width - margin, height - margin);
int imageWidth = r.width() - (border * 2);
int imageHeight = imageWidth * d.getIntrinsicHeight()
/ d.getIntrinsicWidth();
if (imageHeight > r.height() - (border * 2)) {
imageHeight = r.height() - (border * 2);
imageWidth = imageHeight * d.getIntrinsicWidth()
/ d.getIntrinsicHeight();
}
r.left += ((r.width() - imageWidth) / 2) - border;
r.right = r.left + imageWidth + border + border;
r.top += ((r.height() - imageHeight) / 2) - border;
r.bottom = r.top + imageHeight + border + border;
Paint p = new Paint();
/**
* Border Color
*/
p.setColor(Color.RED);
//p.setColor(0xFFC0C0C0);
c.drawRect(r, p);
r.left += border;
r.right -= border;
r.top += border;
r.bottom -= border;
d.setBounds(r);
d.draw(c);
return b;
}
@Override
public void updatePage(CurlPage page, int width, int height, int index) {
switch (index) {
// First case is image on front side, solid colored back.
case 0: {
Bitmap front = loadBitmap(width, height, 0);
page.setTexture(front, CurlPage.SIDE_FRONT);
page.setColor(Color.rgb(180, 180, 180), CurlPage.SIDE_BACK);
break;
}
// Second case is image on back side, solid colored front.
case 1: {
Bitmap back = loadBitmap(width, height, 2);
page.setTexture(back, CurlPage.SIDE_BACK);
page.setColor(Color.CYAN, CurlPage.SIDE_FRONT);
break;
}
// Third case is images on both sides.
case 2: {
Bitmap front = loadBitmap(width, height, 1);
Bitmap back = loadBitmap(width, height, 3);
page.setTexture(front, CurlPage.SIDE_FRONT);
page.setTexture(back, CurlPage.SIDE_BACK);
break;
}
// Fourth case is images on both sides - plus they are blend against
// separate colors.
case 3: {
Bitmap front = loadBitmap(width, height, 2);
Bitmap back = loadBitmap(width, height, 1);
page.setTexture(front, CurlPage.SIDE_FRONT);
page.setTexture(back, CurlPage.SIDE_BACK);
page.setColor(Color.argb(127, 170, 130, 255),
CurlPage.SIDE_FRONT);
page.setColor(Color.WHITE, CurlPage.SIDE_BACK);
break;
}
// Fifth case is same image is assigned to front and back. In this
// scenario only one texture is used and shared for both sides.
case 4:
Bitmap front = loadBitmap(width, height, 0);
page.setTexture(front, CurlPage.SIDE_BOTH);
page.setColor(Color.argb(127, 255, 255, 255),
CurlPage.SIDE_BACK);
break;
}
}
}
/**
* CurlView size changed observer.
*/
private class SizeChangedObserver implements CurlView.SizeChangedObserver {
@Override
public void onSizeChanged(int w, int h) {
if (w > h) {
mCurlView.setViewMode(CurlView.SHOW_TWO_PAGES);
mCurlView.setMargins(.1f, .05f, .1f, .05f);
} else {
mCurlView.setViewMode(CurlView.SHOW_ONE_PAGE);
mCurlView.setMargins(.1f, .1f, .1f, .1f);
}
}
}
}
screenshot like this.
