我想像这样在 android 上制作一个类似于 Flipboard 的应用程序。我正在使用 gridview 来显示图库图像，但它不适用。我怎样才能做到这一点？我也想应用页面卷曲和翻转。因为页面卷曲和翻转。
我必须在翻转板上实现卷曲效果，请任何人指导我。
问问题
18572 次
3 回答
4
您可以使用 ViewFlipper 或 viewPager API 来实现它。ICS 以上支持 ViewPager API。但是，对于情人版本，您可以使用 android.support-v4 库。
对于 View Flipper，您可以使用动画进行翻转。
ViewFlipper 源代码::
import android.app.Activity;
import android.os.Bundle;
import android.view.GestureDetector;
import android.view.MotionEvent;
import android.view.Window;
import android.view.WindowManager;
import android.view.ViewGroup.LayoutParams;
import android.view.animation.AnimationUtils;
import android.widget.ImageView;
import android.widget.ViewFlipper;
public class ViewFlipperActivity extends Activity implements android.view.GestureDetector.OnGestureListener {
/** Called when the activity is first created. */
private int[] imageID = {
R.drawable.a01, R.drawable.a02,
R.drawable.a03, R.drawable.a04,
R.drawable.a05, R.drawable.a06,
R.drawable.a07, R.drawable.a08,
R.drawable.a09, R.drawable.a010,
R.drawable.a011
};
private ViewFlipper viewFlipper = null;
private GestureDetector gestureDetector = null;
@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
//Remove title bar
this.requestWindowFeature(Window.FEATURE_NO_TITLE);
//Remove notification bar
this.getWindow().setFlags(WindowManager.LayoutParams.FLAG_FULLSCREEN, WindowManager.LayoutParams.FLAG_FULLSCREEN);
setContentView(R.layout.main);
viewFlipper = (ViewFlipper) findViewById(R.id.viewflipper);
// gestureDetector Object is used to detect gesture events
gestureDetector = new GestureDetector(this);
for (int i = 0; i < imageID.length; i++)
{
ImageView image = new ImageView(this);
image.setImageResource(imageID[i]);
image.setScaleType(ImageView.ScaleType.FIT_XY);
viewFlipper.addView(image, new LayoutParams(
LayoutParams.FILL_PARENT, LayoutParams.FILL_PARENT));
}
}
public boolean onDown(MotionEvent arg0) {
// TODO Auto-generated method stub
return false;
}
public boolean onFling(MotionEvent arg0, MotionEvent arg1, float arg2,
float arg3) {
// TODO Auto-generated method stub
if (arg0.getX() - arg1.getX() > 120)
{
this.viewFlipper.setInAnimation(AnimationUtils.loadAnimation(this,
R.anim.push_left_in));
this.viewFlipper.setOutAnimation(AnimationUtils.loadAnimation(this,
R.anim.push_left_out));
this.viewFlipper.showNext();
return true;
}
else if (arg0.getX() - arg1.getX() < -120)
{
this.viewFlipper.setInAnimation(AnimationUtils.loadAnimation(this,
R.anim.push_right_in));
this.viewFlipper.setOutAnimation(AnimationUtils.loadAnimation(this,
R.anim.push_right_out));
this.viewFlipper.showPrevious();
return true;
}
return true;
}
public void onLongPress(MotionEvent arg0) {
// TODO Auto-generated method stub
}
public boolean onScroll(MotionEvent arg0, MotionEvent arg1, float arg2,
float arg3) {
// TODO Auto-generated method stub
return false;
}
public void onShowPress(MotionEvent arg0) {
// TODO Auto-generated method stub
}
public boolean onSingleTapUp(MotionEvent arg0) {
// TODO Auto-generated method stub
return false;
}
@Override
public boolean onTouchEvent(MotionEvent event)
{
return this.gestureDetector.onTouchEvent(event);
}
}
查看 Flipper XML 布局：
<ViewFlipper
android:id="@+id/viewflipper"
android:layout_width="fill_parent"
android:layout_height="fill_parent"/>
</LinearLayout>
ViewPager 源代码::
import android.app.Activity;
import android.content.Context;
import android.os.Bundle;
import android.os.Parcelable;
import android.support.v4.view.PagerAdapter;
import android.support.v4.view.ViewPager;
import android.view.Menu;
import android.view.View;
import android.widget.ImageView;
public class MainActivity extends Activity {
private ViewPager viewPager;
private static int NUM_AWESOME_VIEWS = 20;
private Context cxt;
private pageradapter adapter;;
@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
cxt = this;
adapter = new pageradapter();
viewPager = (ViewPager) findViewById(R.id.viewpager);
viewPager.setAdapter(adapter);
}
@Override
public boolean onCreateOptionsMenu(Menu menu) {
getMenuInflater().inflate(R.menu.activity_main, menu);
return true;
}
private class pageradapter extends PagerAdapter{
@Override
public int getCount() {
return NUM_AWESOME_VIEWS;
}
/**
* Create the page for the given position. The adapter is responsible
* for adding the view to the container given here, although it only
* must ensure this is done by the time it returns from
* {@link #finishUpdate()}.
*
* @param container The containing View in which the page will be shown.
* @param position The page position to be instantiated.
* @return Returns an Object representing the new page. This does not
* need to be a View, but can be some other container of the page.
*/
@Override
public Object instantiateItem(View collection, int position) {
ImageView iv = new ImageView(cxt);
iv.setBackgroundResource(R.drawable.a01);
((ViewPager) collection).addView(iv,0);
return iv;
}
/**
* Remove a page for the given position. The adapter is responsible
* for removing the view from its container, although it only must ensure
* this is done by the time it returns from {@link #finishUpdate()}.
*
* @param container The containing View from which the page will be removed.
* @param position The page position to be removed.
* @param object The same object that was returned by
* {@link #instantiateItem(View, int)}.
*/
@Override
public void destroyItem(View collection, int position, Object view) {
((ViewPager) collection).removeView((ImageView) view);
}
@Override
public boolean isViewFromObject(View view, Object object) {
return view==((ImageView)object);
}
/**
* Called when the a change in the shown pages has been completed. At this
* point you must ensure that all of the pages have actually been added or
* removed from the container as appropriate.
* @param container The containing View which is displaying this adapter's
* page views.
*/
@Override
public void finishUpdate(View arg0) {}
@Override
public void restoreState(Parcelable arg0, ClassLoader arg1) {}
@Override
public Parcelable saveState() {
return null;
}
@Override
public void startUpdate(View arg0) {
}
}
}
viewPager XML 布局::
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<android.support.v4.view.ViewPager
android:id="@+android:id/viewpager"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
/>
</RelativeLayout>
于 2012-11-06T07:10:45.493 回答
2
不确定布局，但这个页面翻转动画教程可能会有所帮助：
http://openaphid.github.com/blog/2012/05/21/how-to-implement-flipboard-animation-on-android/
于 2012-11-06T05:08:41.430 回答
0
如果有人从接受的答案中使用库并且需要在没有滑动手势的情况下翻页（例如实现下一个和上一个按钮）可以使用我为自己做的方法。我花了一段时间来弄清楚图书馆是如何工作的，所以我认为它会有所帮助。
将此添加到 FlipCards.java
protected void flipToNextCard()
{
if(accumulatedAngle >= (maxIndex-1)*180 || state != STATE_INIT)
return;
controller.showFlipAnimation();
forward = true;
setState(STATE_AUTO_ROTATE);
controller.getSurfaceView().requestRender();
}
protected void flipToPreviousCard()
{
if(accumulatedAngle <= 0 || state != STATE_INIT)
return;
controller.showFlipAnimation();
forward = false;
swapCards();
frontCards.resetWithIndex(backCards.getIndex() - 1);
controller.flippedToView(getPageIndexFromAngle(accumulatedAngle-1), false);
setState(STATE_AUTO_ROTATE);
controller.getSurfaceView().requestRender();
}
这就是 FlipViewController.java
public void flipToNextView()
{
cards.flipToNextCard();
}
public void flipToPreviousView()
{
cards.flipToPreviousCard();
}
于 2014-03-21T14:29:38.023 回答