欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

Android入門之ViewFlipper翻轉(zhuǎn)視圖的使用詳解

 更新時(shí)間：2022年11月19日 09:39:07   作者：TGITCIC  
本篇給大家?guī)Я说氖荲iewFlipper，它是Android自帶的一個(gè)多頁(yè)面管理控件，且可以自動(dòng)播放！本篇我們我們會(huì)使用兩個(gè)例子：一個(gè)自動(dòng)播放首頁(yè)輪播頁(yè)一個(gè)手動(dòng)可左右滑動(dòng)道頁(yè)的輪播頁(yè)來(lái)說(shuō)透這個(gè)組件的使用，感興趣的可以了解一下

介紹

本篇給大家?guī)Я说氖荲iewFlipper，它是Android自帶的一個(gè)多頁(yè)面管理控件，且可以自動(dòng)播放！ 和ViewPager不同，ViewPager是一頁(yè)頁(yè)的，而ViewFlipper則是一層層的，和ViewPager一樣，很多時(shí)候， 用來(lái)實(shí)現(xiàn)進(jìn)入應(yīng)用后的引導(dǎo)頁(yè)，或者用于圖片輪播，本篇我們我們會(huì)使用兩個(gè)例子：一個(gè)自動(dòng)播放首頁(yè)輪播頁(yè)一個(gè)手動(dòng)可左右滑動(dòng)道頁(yè)的輪播頁(yè)來(lái)說(shuō)透這個(gè)組件的使用。

課程目標(biāo)

我們可以看到，這是一個(gè)化妝品的輪播圖。它以每隔2秒的間隔，從右到左自動(dòng)一個(gè)個(gè)輪播展現(xiàn)首頁(yè)的廣告圖。

項(xiàng)目結(jié)構(gòu)

通過(guò)項(xiàng)目結(jié)構(gòu)，我們可以知道我們的輪播頁(yè)有5頁(yè)，每一頁(yè)內(nèi)含一個(gè)圖片。

然后我們做了一個(gè)平滑過(guò)渡的動(dòng)畫：

  • right_in.xml，從右向左，每隔2秒，滑動(dòng)展示一張；
  • right_out.xml，當(dāng)圖片滑到最后一張，自動(dòng)切換成第一張?jiān)倮^續(xù)從右到左每隔2秒，滑動(dòng)展示一張

這么一個(gè)循環(huán)。

前端代碼

right_in.xml

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
 
    <translate
        android:duration="2000"
        android:fromXDelta="100%p"
        android:toXDelta="0" />
 
</set>

right_out.xml

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android" >
 
    <translate
        android:duration="2000"
        android:fromXDelta="0"
        android:toXDelta="-100%p" />
 
</set>

page_ad_one.xml~page_ad_five.xml

內(nèi)容都一樣，只是內(nèi)含的圖片不一樣

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent">
    <ImageView
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:src="@drawable/ad_pic_1"
        />
</LinearLayout>
 activity_main.xml
<?xml version="1.0" encoding="utf-8"?>
<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"
    tools:context=".MainActivity">
 
    <ViewFlipper
        android:id="@+id/adFlipper"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:inAnimation="@anim/right_in"
        android:outAnimation="@anim/right_out"
        android:flipInterval="2000">
 
        <include layout="@layout/page_ad_one" />
        <include layout="@layout/page_ad_two" />
        <include layout="@layout/page_ad_three" />
        <include layout="@layout/page_ad_four" />
        <include layout="@layout/page_ad_five" />
 
    </ViewFlipper>
 
</RelativeLayout>

后端代碼

MainActivity.java

package org.mk.android.demoautoflipper;
 
import androidx.appcompat.app.AppCompatActivity;
 
import android.os.Bundle;
import android.widget.ViewFlipper;
 
public class MainActivity extends AppCompatActivity {
 
    private ViewFlipper adFlipper;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        adFlipper=(ViewFlipper)findViewById(R.id.adFlipper);
        adFlipper.startFlipping();
    }
}

非常簡(jiǎn)單。

接著我們來(lái)說(shuō)手動(dòng)滑動(dòng)的例子

手動(dòng)滑動(dòng)代替了自動(dòng)輪播，因此我們支持兩種手勢(shì)，往左滑和往右滑。因此我人把從右到左滑設(shè)成+向，從左到向設(shè)成-向。因此我們?yōu)榱酥С窒蛴?、向左的手?shì)還需要設(shè)置一組left_in.xml和left_out.xml。

前端代碼只增加了left_in.xml和left_out.xml

left_in.xml

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android" >
 
    <translate
        android:duration="500"
        android:fromXDelta="-100%p"
        android:toXDelta="0" />
 
</set>

left_out.xml

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
 
    <translate
        android:duration="500"
        android:fromXDelta="0"
        android:toXDelta="100%p" />
 
</set>

MainActivity.java

package org.mk.android.demomanualflipper;
 
import androidx.appcompat.app.AppCompatActivity;
 
import android.content.Context;
import android.os.Bundle;
import android.view.GestureDetector;
import android.view.MotionEvent;
import android.widget.ImageView;
import android.widget.ViewFlipper;
 
public class MainActivity extends AppCompatActivity {
 
 
    private Context mContext;
    private ViewFlipper vflp_help;
    private int[] resId = {R.drawable.ad_pic_1, R.drawable.ad_pic_2,
            R.drawable.ad_pic_3, R.drawable.ad_pic_4, R.drawable.ad_pic_5};
 
    private final static int DISTANCE = 200;   //最小距離
    private CustomerizedGestureListener cgListener;
    private GestureDetector gDetector;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        mContext = MainActivity.this;
        //實(shí)例化SimpleOnGestureListener與GestureDetector對(duì)象
        cgListener = new CustomerizedGestureListener();
        gDetector = new GestureDetector(this, cgListener);
        vflp_help = (ViewFlipper) findViewById(R.id.adFlipper);
        //動(dòng)態(tài)導(dǎo)入添加子View
        for(int i = 0;i < resId.length;i++){
            vflp_help.addView(getImageView(resId[i]));
        }
    }
    //重寫onTouchEvent觸發(fā)MyGestureListener里的方法
    @Override
    public boolean onTouchEvent(MotionEvent event) {
        return gDetector.onTouchEvent(event);
    }
    //自定義一個(gè)GestureListener,這個(gè)是View類下的
    private class CustomerizedGestureListener extends GestureDetector.SimpleOnGestureListener {
        @Override
        public boolean onFling(MotionEvent e1, MotionEvent e2, float v, float v1) {
            if(e1.getX() - e2.getX() > DISTANCE){
                vflp_help.setInAnimation(mContext,R.anim.right_in);
                vflp_help.setOutAnimation(mContext, R.anim.right_out);
                vflp_help.showNext();
            }else if(e2.getX() - e1.getX() > DISTANCE){
                vflp_help.setInAnimation(mContext,R.anim.left_in);
                vflp_help.setOutAnimation(mContext, R.anim.left_out);
                vflp_help.showPrevious();
            }
            return true;
        }
    }
 
    private ImageView getImageView(int resId){
        ImageView img = new ImageView(this);
        img.setBackgroundResource(resId);
        return img;
    }
}

代碼導(dǎo)讀：

首先，在這個(gè)例子里我們使用了代碼來(lái)添加一個(gè)個(gè)ViewFlipper；

其次我們定義了一個(gè)GestureDetector.SimpleOnGestureListener來(lái)支持向左滑屏或者向右滑屏。在這個(gè)事件里我們通過(guò)e1與e2的距離（DISTANCE)可判斷出正負(fù)，然后以此來(lái)控制向左到頭來(lái)?yè)Q第一張，向右到頭了換最后一張的效果；

以上就是Android入門之ViewFlipper翻轉(zhuǎn)視圖的使用詳解的詳細(xì)內(nèi)容，更多關(guān)于Android ViewFlipper翻轉(zhuǎn)視圖的資料請(qǐng)關(guān)注腳本之家其它相關(guān)文章！

相關(guān)文章

最新評(píng)論