Android UI设计（引导界面）：ViewPager之界面添加底部圆点与循环显示

最新推荐文章于 2021-10-10 16:39:27 发布

danfengw

最新推荐文章于 2021-10-10 16:39:27 发布

阅读量1.4k

点赞数

分类专栏： Android Android UI基本控件的使用

本文链接：https://blog.csdn.net/danfengw/article/details/48214893

版权

本文介绍了如何在Android的ViewPager引导界面中添加底部圆点指示器，提供了两种实现方案：自定义shape和使用给定图片。同时，详细解释了如何实现ViewPager的循环显示效果，包括修改adapter的方法和在MainActivity中处理滑动逻辑。

摘要由CSDN通过智能技术生成

添加底部圆点

一、方案一（通过自定义shape）

这里写图片描述
在布局中直接添加View对象，并设置background为未选中的shape。

布局：

<LinearLayout 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:orientation="vertical"
    tools:context=".MainActivity" >

    <android.support.v4.view.ViewPager
        android:id="@+id/viewpager"
        android:layout_width="wrap_content"
        android:layout_height="0dp"
        android:layout_gravity="center"
        android:layout_weight="1" >
    </android.support.v4.view.ViewPager>

    <LinearLayout 
         android:layout_width="match_parent"
            android:layout_height="35dip"
            android:layout_gravity="bottom"
            android:gravity="center"
            android:orientation="vertical"             
        >
    <LinearLayout
        android:id="@+id/linear"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginTop="3dip"
        android:gravity="center"      
        android:orientation="horizontal" >  
         <View
            android:id="@+id/text1"
            android:layout_width="10dip"
            android:layout_height="10dip"
            android:layout_marginLeft="2dip"
            android:layout_marginRight="2dip"
            android:layout_weight="1"
            android:background="@drawable/text_bg" />

        <View
            android:id="@+id/text2"
            android:layout_width="10dip"
            android:layout_height="10dip"
            android:layout_marginLeft="2dip"
            android:layout_marginRight="2dip"
            android:layout_weight="1"
            android:background="@drawable/text_bg" />

        <View
            android:id="@+id/text3"
            android:layout_width="10dip"
            android:layout_height="10dip"
            android:layout_marginLeft="2dip"
            android:layout_marginRight="2dip"
            android:layout_weight="1"
            android:background="@drawable/text_bg" />

        <View
            android:id="@+id/text4"
            android:layout_width="10dip"
            android:layout_height="10dip"
            android:layout_marginLeft="2dip"
            android:layout_marginRight="2dip"
            android:layout_weight="1"
            android:background="@drawable/text_bg" />  
    </LinearLayout>
</LinearLayout>
</LinearLayout>