本篇文章給大家分享的是有關(guān)怎么在Android中利用ViewPager實(shí)現(xiàn)一個(gè)屏幕滑動(dòng)效果,小編覺(jué)得挺實(shí)用的,因此分享給大家學(xué)習(xí),希望大家閱讀完這篇文章后可以有所收獲,話不多說(shuō),跟著小編一起來(lái)看看吧。
成都創(chuàng)新互聯(lián)公司-專業(yè)網(wǎng)站定制、快速模板網(wǎng)站建設(shè)、高性價(jià)比龍門網(wǎng)站開(kāi)發(fā)、企業(yè)建站全套包干低至880元,成熟完善的模板庫(kù),直接使用。一站式龍門網(wǎng)站制作公司更省心,省錢,快速模板網(wǎng)站建設(shè)找我們,業(yè)務(wù)覆蓋龍門地區(qū)。費(fèi)用合理售后完善,十年實(shí)體公司更值得信賴。
創(chuàng)建View
創(chuàng)建一個(gè)在之后作為fragment的內(nèi)容的布局文件,下面的例子中包含一個(gè)Textview,用來(lái)展示一些文字。
創(chuàng)建Fragment
創(chuàng)建一個(gè)Fragment子類,并在onCreateView()方法中加載上一步里創(chuàng)建的布局。
import android.support.v4.app.Fragment; ... public class ScreenSlidePageFragment extends Fragment { @Override public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) { ViewGroup rootView = (ViewGroup) inflater.inflate( R.layout.fragment_screen_slide_page, container, false); return rootView; } }
創(chuàng)建完成之后,就可以在父Activity中創(chuàng)建任意個(gè)該fragment的實(shí)例來(lái)向用戶展示內(nèi)容了。
添加ViewPager
ViewPager內(nèi)嵌了對(duì)滑動(dòng)手勢(shì)的支持,因此它在默認(rèn)設(shè)置下就能夠?qū)崿F(xiàn)屏幕滑動(dòng)。
首先,創(chuàng)建一個(gè)布局文件,包含一個(gè)ViewPager:
創(chuàng)建一個(gè)Activity,包含以下內(nèi)容:
將其Content View設(shè)置為上面創(chuàng)建的布局
創(chuàng)建一個(gè)FragmentStatePagerAdapter的子類,并實(shí)現(xiàn)其getItem()方法來(lái)提供頁(yè)面、getCount()方法來(lái)確定頁(yè)面數(shù)量。
將FragmentStatePagerAdapter實(shí)例和ViewPager實(shí)例綁定。
處理設(shè)備的返回鍵,使其能夠從虛擬的Fragment棧中移除Fragment來(lái)實(shí)現(xiàn)返回上一頁(yè)的效果。如果當(dāng)前已經(jīng)處于第一頁(yè),那么就從Activity中返回。
import android.support.v4.app.Fragment; import android.support.v4.app.FragmentManager; ... public class ScreenSlidePagerActivity extends FragmentActivity { /** * The number of pages (wizard steps) to show in this demo. */ private static final int NUM_PAGES = 5; /** * The pager widget, which handles animation and allows swiping horizontally to access previous * and next wizard steps. */ private ViewPager mPager; /** * The pager adapter, which provides the pages to the view pager widget. */ private PagerAdapter mPagerAdapter; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_screen_slide); // Instantiate a ViewPager and a PagerAdapter. mPager = (ViewPager) findViewById(R.id.pager); mPagerAdapter = new ScreenSlidePagerAdapter(getSupportFragmentManager()); mPager.setAdapter(mPagerAdapter); } @Override public void onBackPressed() { if (mPager.getCurrentItem() == 0) { // If the user is currently looking at the first step, allow the system to handle the // Back button. This calls finish() on this activity and pops the back stack. super.onBackPressed(); } else { // Otherwise, select the previous step. mPager.setCurrentItem(mPager.getCurrentItem() - 1); } } /** * A simple pager adapter that represents 5 ScreenSlidePageFragment objects, in * sequence. */ private class ScreenSlidePagerAdapter extends FragmentStatePagerAdapter { public ScreenSlidePagerAdapter(FragmentManager fm) { super(fm); } @Override public Fragment getItem(int position) { return new ScreenSlidePageFragment(); } @Override public int getCount() { return NUM_PAGES; } } }
使用PageTransformer自定義屏幕滑動(dòng)效果
可以實(shí)現(xiàn)ViewPager.PageTransformer接口來(lái)展示一個(gè)不同于默認(rèn)實(shí)現(xiàn)的屏幕滑動(dòng)效果。這個(gè)接口中只有一個(gè)transformPage()方法。在屏幕滑動(dòng)過(guò)程中它會(huì)在那些能夠看到的頁(yè)面(當(dāng)前頁(yè)面以及鄰近頁(yè)面)上反復(fù)調(diào)用。例如,假設(shè)當(dāng)前位于第三頁(yè),如果用戶向第四頁(yè)滑動(dòng),那么transformPage()會(huì)在第二、第三、第四頁(yè)上被調(diào)用。
當(dāng)實(shí)現(xiàn)transformPage()時(shí),你需要根據(jù)頁(yè)面當(dāng)前所處的位置(相對(duì)于屏幕)來(lái)確定它的變化。不同的變化就能帶來(lái)不同的屏幕滑動(dòng)效果。頁(yè)面相對(duì)于屏幕的位置包含在參數(shù)position中。
position指明了一個(gè)給定的頁(yè)面相對(duì)于屏幕中心的位置。這是一個(gè)動(dòng)態(tài)的屬性,會(huì)隨著用戶的滑動(dòng)手勢(shì)而變化。當(dāng)頁(yè)面充滿屏幕時(shí),position的值為0;當(dāng)頁(yè)面即將在屏幕左側(cè)消失時(shí),它的值趨近于-1;當(dāng)頁(yè)面即將在屏幕右側(cè)消失時(shí),它的值趨近于1。根據(jù)position的值,你可以使用setTranslationX()、setScaleY()等方法來(lái)實(shí)現(xiàn)自定義的動(dòng)畫效果。
當(dāng)實(shí)現(xiàn)了一個(gè)PageTransformer之后,使用ViewPager的setPageTransformer()方法將動(dòng)畫投入使用。示例如下:
ViewPager mPager = (ViewPager) findViewById(R.id.pager); ... mPager.setPageTransformer(true, new ZoomOutPageTransformer());
需要注意的是,默認(rèn)的屏幕滑動(dòng)效果不會(huì)被PageTransformer覆蓋,因此計(jì)算屬性值是要考慮是否會(huì)導(dǎo)致滑動(dòng)速度變快或是變慢。
下面是兩個(gè)PageTransformer的實(shí)現(xiàn)示例:
Zoom-out page transformer
public class ZoomOutPageTransformer implements ViewPager.PageTransformer { private static final float MIN_SCALE = 0.85f; private static final float MIN_ALPHA = 0.5f; public void transformPage(View view, float position) { int pageWidth = view.getWidth(); int pageHeight = view.getHeight(); if (position < -1) { // [-Infinity,-1) // This page is way off-screen to the left. view.setAlpha(0); } else if (position <= 1) { // [-1,1] // Modify the default slide transition to shrink the page as well float scaleFactor = Math.max(MIN_SCALE, 1 - Math.abs(position)); float vertMargin = pageHeight * (1 - scaleFactor) / 2; float horzMargin = pageWidth * (1 - scaleFactor) / 2; if (position < 0) { view.setTranslationX(horzMargin - vertMargin / 2); } else { view.setTranslationX(-horzMargin + vertMargin / 2); } // Scale the page down (between MIN_SCALE and 1) view.setScaleX(scaleFactor); view.setScaleY(scaleFactor); // Fade the page relative to its size. view.setAlpha(MIN_ALPHA + (scaleFactor - MIN_SCALE) / (1 - MIN_SCALE) * (1 - MIN_ALPHA)); } else { // (1,+Infinity] // This page is way off-screen to the right. view.setAlpha(0); } } }
Depth page transformer
public class DepthPageTransformer implements ViewPager.PageTransformer { private static final float MIN_SCALE = 0.75f; public void transformPage(View view, float position) { int pageWidth = view.getWidth(); if (position < -1) { // [-Infinity,-1) // This page is way off-screen to the left. view.setAlpha(0); } else if (position <= 0) { // [-1,0] // Use the default slide transition when moving to the left page view.setAlpha(1); view.setTranslationX(0); view.setScaleX(1); view.setScaleY(1); } else if (position <= 1) { // (0,1] // Fade the page out. view.setAlpha(1 - position); // Counteract the default slide transition view.setTranslationX(pageWidth * -position); // Scale the page down (between MIN_SCALE and 1) float scaleFactor = MIN_SCALE + (1 - MIN_SCALE) * (1 - Math.abs(position)); view.setScaleX(scaleFactor); view.setScaleY(scaleFactor); } else { // (1,+Infinity] // This page is way off-screen to the right. view.setAlpha(0); } } }
以上就是怎么在Android中利用ViewPager實(shí)現(xiàn)一個(gè)屏幕滑動(dòng)效果,小編相信有部分知識(shí)點(diǎn)可能是我們?nèi)粘9ぷ鲿?huì)見(jiàn)到或用到的。希望你能通過(guò)這篇文章學(xué)到更多知識(shí)。更多詳情敬請(qǐng)關(guān)注創(chuàng)新互聯(lián)行業(yè)資訊頻道。