1. 程式人生 > >Android 使用ViewPager實現導航頁面

Android 使用ViewPager實現導航頁面

PagerAdapter類

/**
 * 作者:created by meixi
 * 郵箱:[email protected]
 * 日期:2018/7/23 17
 */

public class GuidePageAdapter extends PagerAdapter {
    private List<View> views;
    public GuidePageAdapter(List<View> views) {
        this.views = views;
    }

    @Override
    public int getCount() {
        if (views != null) {
            return views.size();
        }
        return 0;
    }

    @Override
    public boolean isViewFromObject(View arg0, Object arg1) {
        return (arg0 == arg1);
    }

    @Override
    public void destroyItem(View view, int arg1, Object object) {
        ((ViewPager) view).removeView(views.get(arg1));
    }

    @Override
    public Object instantiateItem(final View view, final int current) {
        ((ViewPager) view).addView(views.get(current));
        return views.get(current);
    }

}

導航類layout

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="@color/white"
    android:orientation="vertical" >

    <android.support.v4.view.ViewPager
        android:id="@+id/vp_guide"
        android:layout_width="match_parent"
        android:layout_height="wrap_content" />
    <TextView
        android:id="@+id/myposition"
        android:layout_width="40dp"
        android:layout_height="20dp"
        android:layout_marginTop="10dp"
        android:background="@drawable/onetebg"
        android:textColor="@color/titleBlue"
        android:gravity="center"
        android:layout_alignParentRight="true"
        android:text="1"/>

</RelativeLayout>

onetebg背景樣式

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">

    <!-- 設定透明背景色 -->
    <solid android:color="@color/white" />

    <!-- 設定一個黑色邊框 -->
    <stroke
        android:width="1px"
        android:color="@color/transparent" />
    <!-- 設定四個圓角的半徑 -->
    <corners
        android:radius="14dp"/>
    <!-- 設定一下邊距,讓空間大一點 -->
    <padding
        android:bottom="0dp"
        android:left="0dp"
        android:right="0dp"
        android:top="0dp" />

</shape>

導航類activity

public class ViewPagerActivity extends Activity {
    private ViewPager vp;
    private TextView textView;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.guide_activity);
        initViews();
        initData();
    }
    public void initViews(){
        vp = (ViewPager) findViewById(R.id.vp_guide);
        textView =(TextView)findViewById(R.id.myposition);
    }
    public void initData(){
        List<View> guideList = new ArrayList<>();
        guideList.add(getGuideView(R.drawable.guide_1));
        guideList.add(getGuideView(R.drawable.guide_2));
        guideList.add(getGuideView(R.drawable.guide_3));
        RelativeLayout rl = new RelativeLayout(this);
//        rl.setLayoutParams(new ViewGroup.LayoutParams(ViewGroup.LayoutParams.MATCH_PARENT, ViewGroup.LayoutParams.MATCH_PARENT));
//        rl.setBackgroundColor(this.getResources().getColor(R.color.transparent));
//        guideList.add(rl);
        Log.i("lgq","sss==="+MyApplication.getnScreenWidth()+"..."+ViewGroup.LayoutParams.MATCH_PARENT);
        GuidePageAdapter vpAdapter = new GuidePageAdapter(guideList);
        vp.setAdapter(vpAdapter);
        vp.setOnPageChangeListener(new ViewPager.OnPageChangeListener() {
            @Override
            public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {
            }
            @Override
            public void onPageSelected(int position) {
                textView.setText(position+1+"/"+3);
            }
            @Override
            public void onPageScrollStateChanged(int state) {
            }
        });
    }
    private View getGuideView(int nDrawableID) {
        ImageView iv = new ImageView(this);
        ViewGroup.LayoutParams lp = new ViewGroup.LayoutParams(ViewGroup.LayoutParams.MATCH_PARENT, ViewGroup.LayoutParams.MATCH_PARENT);
        iv.setLayoutParams(lp);
        iv.setBackground(this.getResources().getDrawable(R.drawable.guide_1));
        iv.setScaleType(ImageView.ScaleType.CENTER_INSIDE);
        iv.setImageResource(nDrawableID);
        return iv;
    }
}

activity配置屬性

<activity android:name=".ViewPagerActivity"
    android:configChanges="orientation|keyboardHidden"
    android:label="@string/app_name"
    android:screenOrientation="portrait"
    android:windowSoftInputMode="stateHidden|adjustPan"></activity>

相關推薦

Android 使用ViewPager實現導航頁面

PagerAdapter類 /** * 作者:created by meixi * 郵箱:[email protected] * 日期:2018/7/23 17 */ public class GuidePageAdapter extends Pager

android ViewPager實現App主介面Tab選單頁面切換和點選事件

Tabhost實現頁面滑動切換比較麻煩,這裡介紹一下viewPage 控制元件。 實現了三屏滑動帶標題點選和tab頁面內按鈕的的點選事件實現; viewPage  的優點是可以滑動切換缺點是MainA

Android ViewPager實現滑動切換頁面+底部tab點選切換頁面(類微信首頁)

目錄:1.實現功能概述2.程式碼實現 1.實現功能概述實現了滑動更換頁面同時切換底部Tab的圖示、文字的顏色,同時也支援點選底部Tab達到切換頁面的效果,有點類似微信首頁佈局 外帶實現toolbar overflow選單顯示圖示。 2.程式碼實現 2.1 效果截圖(資源來源

Android ViewPager實現多個圖片水平滾動

oncreate iss block 如果 del ner ide extends 大小 1.示意圖 2.實現分析 (1).xml配置 <!-- 配置container和pager的clipChildre

Android-FrameLayout實現頁面(QQ頁面)

第一步 在activity_main.xml中佈局 <?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/androi

Android ViewPager實現圖片瀏覽器

Android ViewPager實現圖片瀏覽器 一、目標 二、體驗地址 三、方案選擇 四、PageTransformer 五、剪裁控制元件 六、ClipPageTransformer 七、Final

Android5.0新元件TabLayout+ViewPager實現Tab頁面

本來算是個雞肋的東西,但是design相容包釋出之後情況就大不一樣了。 下面看程式碼: 首先在gradle中新增依賴 dependencies { compile fileTree(incl

Android ViewPager實現的圖片輪播

Android ViewPager實現的簡單圖片輪播 HoriziontalBannerView hsv = (HoriziontalBannerView) findViewById(R.i

Android ViewPager實現圖片 小圓點切換

pager_layout.xml: <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.c

Android ViewPager 實現無限迴圈滑動

先高亮一個問題向大家請教,謝謝大家!就是用PagerTabStripe實現時,title總是在文字的中間,怎麼能讓標題在view的左上角呢?謝謝大家!圖是在隨便找的,就是怎麼讓這個“Nearby”顯示在最左邊呢? 已經用ViewPager 和PagerTabStrip 實

Android Fragment實現導航

一、嘮叨嘮叨 人生第一次寫部落格,也不求有什麼大神之作,就自己練練手,讓自己學會表達,學會把自己心裡的東西拿出來給人家看看,就像找女朋友一樣,你不說出來自己多愛她,甚至不表現出來,哪裡會有機會呢,是吧?讓她自己發現你,愛上你,可能性好小的樣子。。。 二、導航

Android ViewPager實現上一頁下一頁左右滑動的正確方法

回顧一下這個功能的應用場景:有一個裝有很多條資料的一個list,這個list在listView中顯示出來了,現在滑動listView隨便到一個位置,點選一個item進入資料的詳情頁,在這個詳情頁,我們用到了viewPager,讓它實現左右滑動的效果。 以前我也是在網上找

Android實戰簡易教程-第二十六槍(基於ViewPager實現微信頁面切換效果)

stat addview data android tid des viewpage 聊天 == 1.頭部布局文件top.xml:<?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:and

底部導航欄:利用viewpager實現Android底部標題欄

設定小紅點和數字方法: http://blog.csdn.net/yancychas/article/details/77331177 方法一. ViewPager + List<View> + PagerAdapter 先看activity_main

Android ViewPager和Fragment實現仿微信導航介面及滑動效果

1 先看看實現的效果: ps:上面每一幀Fragment中,包含是來自網路的圖片; 實現ViewPager+Fragment的頁面滑動和底部導航原理 主佈局檔案如下: <?xml version="1.0" encoding="utf-8"?> <L

Android ViewPager和Fragment實現頂部導航介面滑動效果、標籤下的tab位置

在專案中,我們常常需要實現介面滑動切換的效果。例如,微信介面的左右滑動切換效果。那這種效果是怎麼實現的?今天我就帶大家簡單瞭解ViewPager,並通過例項來實現該效果。 一. ViewP

android 學習之Fragment+ViewPager實現頁面左右滑動標籤頁

ViewPager 結合Fragment實現一個Activity裡包含多個可滑動的標籤頁,每個標籤頁可以有獨立的佈局及響應。 如下所示。 我們可以藉助TabLayout來實現頂部導航。Activity佈局檔案如下: <?xml version="1.0" encod

androidViewPager簡單實現區域性頁面滑動效果

-Viewpager能實現什麼效果? -實現左右滑動,切換view的效果。 -既可以實現整個頁面左右滑動,也可以實現同一個頁面中區域性左右滑動。 搞清楚viewpager的作用後,開始寫一個簡單例子,實現同一個頁面中區域性滑動的效果。 在coding前要做的準備工作 2

AndroidViewPager實現引導頁(第一次開啟App進入引導頁,第二次直接進入APP主頁面)...

有的App當你第一次開啟的是和常常會有引導頁來描述一些App資訊(功能,特點),當然也要做驗證,驗證第二次進入不進入引導頁,直接進入App,此部落格藉助ViewPager來實現引導頁, ViewPager類提供了多介面切換的新效果,是谷歌在3.0之後加入的新特性,所以需要引用

Android實現一個簡單的天氣預報APP(十三) 導航ViewPager

學習參考資源:https://www.gitbook.com/book/zhangqx/mini-weather/details ViewPager是安裝軟體後,第一次開啟軟體時展示的導航。 1)在進入天氣介面之前,先進入導航介面 1.建立一個導航佈局 guide.xml一