Android 引导页编写制作_Android

Android 引导页制作（加小圆点）

1.导包：导入viewpager包（4.0版本以上已自带）/或者使用viewpager2

implementation 'androidx.viewpager2:viewpager2:1.1.0-alpha01'

主要流程：布局文件添加viewpage控件以及自定义Layout控件：

<?xml version="1.0" encoding="utf-8"?> <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:app="http://schemas.android.com/apk/res-auto" xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent" android:layout_height="match_parent" android:background="#ccc" tools:context=".MainActivity"> <androidx.viewpager.widget.ViewPager
        android:id="@+id/viewpager" android:layout_width="match_parent" android:layout_height="match_parent"> <requestFocus /> </androidx.viewpager.widget.ViewPager> <com.example.viewpager.BottomLinulayout
        android:id="@+id/btx" android:layout_width="match_parent" android:layout_marginTop="600dp" android:layout_height="wrap_content" /> </RelativeLayout>

viewpager2可以添加滑动方向（竖直或水平）

package com.example.viewpager; import androidx.appcompat.app.AppCompatActivity; import androidx.viewpager.widget.ViewPager; import android.content.Intent; import android.graphics.Point; import android.os.Bundle; import android.util.Log; import android.view.LayoutInflater; import android.view.MotionEvent; import android.view.View; import android.view.WindowManager; import android.widget.Button; import java.util.ArrayList; public class MainActivity extends AppCompatActivity { int currentItem; ArrayList<View> views = new ArrayList<View>(); private static final int[] pics = { R.layout.layout1, R.layout.layout2, R.layout.layout3};//初始化图片资源，创建XML文件显示引导页 @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); initViewPager(); } private void initViewPager() { ViewPager viewPager =(ViewPager)findViewById(R.id.viewpager); for (int i = 0; i < pics.length; i++) { View view = LayoutInflater.from(this).inflate(pics[i], null); if (i == pics.length - 1) { Button btt = view.findViewById(R.id.jr);//**重点：这里必须添加view来绑定控件，否则会空指针** btt.setOnClickListener(new View.OnClickListener() { @Override public void onClick(View view) { Intent intent = new Intent(MainActivity.this, Main2Activity.class); startActivity(intent); } }); } views.add(view);//list添加页面 } final BottomLinulayout bt=findViewById(R.id.btx);//绑定小圆点控件 bt.initViews(views.size(),30,2);//参数：圆点个数、高度、间距 MYViewPageAdapter adapter = new MYViewPageAdapter(); adapter.setViews(views);//设置适配器参数 viewPager.setAdapter(adapter);//设置适配器 viewPager.addOnPageChangeListener(new ViewPager.OnPageChangeListener() { @Override public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) { } @Override public void onPageSelected(int position) { if(bt != null){ bt.changePosition(position);//当页面改变后改变圆点位置，通过view的position同步 } } @Override public void onPageScrollStateChanged(int state) { } }); viewPager.setOnTouchListener(new View.OnTouchListener() { float startX; float startY; float endX; float endY; @Override public boolean onTouch(View view, MotionEvent event) { switch (event.getAction()){ case MotionEvent.ACTION_DOWN://当触摸按下
                       startX=event.getX(); startY=event.getY(); break; case MotionEvent.ACTION_UP://当触摸抬起来
                       endX=event.getX(); endY=event.getY(); WindowManager windowManager= (WindowManager) getApplicationContext().getSystemService(MainActivity.this.WINDOW_SERVICE); //获取屏幕的宽度 Point size = new Point(); windowManager.getDefaultDisplay().getSize(size); int width=size.x; //首先要确定的是，是否到了最后一页，然后判断是否向左滑动，并且滑动距离是否符合，我这里的判断距离是屏幕宽度的4分之一（这里可以适当控制） if(currentItem==(views.size()-1)&&startX-endX>0&&startX-endX>=(width/4)){ // goToMainActivity();//跳转页面 overridePendingTransition(R.xml.slide_in_right,R.xml.slide_in_left);//实现两个 Activity 切换时的动画。左滑 右滑，通过xml进行动画编辑 } break; } return false; } }); } private void goToMainActivity() { Intent intent=new Intent(this,Main2Activity.class); startActivity(intent); } }

其中，需要自定义适配器，继承pageadpter：

package adpter; import android.view.View; import android.widget.BaseAdapter; import androidx.viewpager.widget.PagerAdapter; import androidx.viewpager.widget.ViewPager; import java.util.ArrayList; public class MYViewPageAdapter extends PagerAdapter { private ArrayList<View> views; public void setViews(ArrayList<View> views){ this.views = views; } @Override public int getCount() { return views.size(); }//返回view个数 @Override public boolean isViewFromObject(View arg0, Object arg1) { return arg0 == arg1; } @Override public void destroyItem(View container, int position, Object object) { ((ViewPager)container).removeView(views.get(position)); }//删除页面 @Override public Object instantiateItem(View container, int position) { ((ViewPager) container).addView(views.get(position)); return views.get(position);//生成页面 } }

小圆点的自定义布局文件：

package com.example.viewpager; import android.content.Context; import android.util.AttributeSet; import android.view.Gravity; import android.view.View; import android.widget.LinearLayout; import android.widget.TextView; import androidx.annotation.Nullable; public class BottomLinulayout extends LinearLayout { private int itemDefaultBgResId = R.drawable.normal;//单个元素默认背景样式 private int itemSelectedBgResId = R.drawable.select;//单个元素选中背景样式 private int currentPosition;//当前选中位置 private int itemHeight = 50;//item宽高 private int itemMargin = 5;//item间距 public BottomLinulayout(Context context) { this(context, null, 0); } public BottomLinulayout(Context context, @Nullable AttributeSet attrs) { this(context, attrs, 0); } public BottomLinulayout(Context context, @Nullable AttributeSet attrs, int defStyleAttr) { super(context, attrs, defStyleAttr); setOrientation(HORIZONTAL); setGravity(Gravity.CENTER); } public void initViews(int count, int itemHeight, int itemMargin) {//设置小圆点 this.itemHeight = itemHeight; this.itemMargin = itemMargin; removeAllViews();//每次创建移除views if(count == 0 || itemHeight == 0){ return; } View view = createView(itemHeight,itemMargin);//创建一个view view.setBackgroundResource(itemSelectedBgResId);//设置当前选中的样式 addView(view);//将view添加到布局中 if(count == 1){ return;//如果只有一个 不必生成未选中的图 } for (int i = 1; i < count; i++) { view = createView(itemHeight,itemMargin); view.setBackgroundResource(itemDefaultBgResId);//生成未选中的样式 addView(view); } } /**
     * 创建view
     * @param sideLength 边长
     * @param itemMargin 外间距
     * @return
     */ public View createView(int sideLength,int itemMargin){ TextView textview = new TextView(getContext()); LinearLayout.LayoutParams params = new LayoutParams(sideLength, sideLength);//LayoutParams 是 ViewGroup 的一个内部类，这是一个基类， if(itemMargin > 0){ params.setMargins(itemMargin,0,itemMargin,0); } textview.setLayoutParams(params);//设置textview的Parms return textview; } public void changePosition(int position) {//改变选中的view if(getChildCount() <= 1){ return; } getChildAt(currentPosition).setBackgroundResource(itemDefaultBgResId); currentPosition = position % getChildCount(); getChildAt(currentPosition).setBackgroundResource(itemSelectedBgResId); } }

小圆点实心或者空心文件，通过shape文件控制

//空心 <?xml version="1.0" encoding="utf-8"?> <shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="oval">//shape设置形状 oval为椭圆 rectangle（矩形），ov，line(线形)，ring(圆环) <solid android:color="#fff"/>//设置填充色 <size
    android:width="10dp"//设置宽 android:height="10dp"></size> <stroke android:color="#ccc" android:width="1dp"/> </shape> ```java //实心 <?xml version="1.0" encoding="utf-8"?> <shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="oval"> <solid android:color="@color/cardview_dark_background"/> <size
        android:width="9dp" android:height="9dp"></size> <!--<stroke android:color="#fff" android:width="1dp"/>--> </shape>