最最最简单的带指示器 ViewPager引导页制作方法

@TOC最最最简单的ViewPager引导页制作方法!带指示器!

1.首先。我们先创建一个布局文件

<?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"
    tools:context=".MainActivity">

    <androidx.viewpager.widget.ViewPager
        android:id="@+id/view_pager"
        android:layout_width="match_parent"
        android:layout_height="match_parent" />

    <Button
        android:id="@+id/btn"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentEnd="true"
        android:layout_marginTop="10dp"
        android:layout_marginEnd="10dp"
        android:background="@drawable/ydy_btn"
        android:text="进入主页"
        android:textColor="#FFFFFF"
        android:textSize="18sp"
        android:visibility="gone" />

	//这里是哪来做指示器的
    <LinearLayout
        android:id="@+id/ll"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true"
        android:layout_centerHorizontal="true"
        android:layout_marginBottom="30dp"
        android:gravity="center"
        android:orientation="horizontal" />

</RelativeLayout>

2.创建一个Fragment

public class GuideFragment extends Fragment {
    private ViewHolder holder;
    private String imgUrl;

	//这里通过构造方法传入一个图片的路径
    public GuideFragment(String imgUrl) {
        // Required empty public constructor
        this.imgUrl = imgUrl;
    }
    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container,
                             Bundle savedInstanceState) {
        // Inflate the layout for this fragment
        View view = inflater.inflate(R.layout.fragment_guide, container, false);
        holder = new ViewHolder(view);	//获得holder
        return view;
    }

	//最好把加载图片写在这里
    @Override
    public void onActivityCreated(@Nullable Bundle savedInstanceState) {
        super.onActivityCreated(savedInstanceState);
        Glide.with(getActivity()).load(imgUrl).into(holder.image);
    }

    public static
    class ViewHolder {
        public View rootView;
        public ImageView image;

        public ViewHolder(View rootView) {
            this.rootView = rootView;
            this.image = (ImageView) rootView.findViewById(R.id.image);
        }
    }
}

3.Activity初始化内容以及填充内容

public class MainActivity extends AppCompatActivity implements View.OnClickListener {

    private Button btn;
    private String TAG = "MainActivity";
    private Ydy ydy;	//这个是我网络请求获得的引导页对象
    private ViewPager view_pager;
    private List<Fragment> fragments;
    private LinearLayout ll;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        initView();
        getGuide();
    }
	
	//初始化页面,获得控件的对象
    private void initView() {
        btn = (Button) findViewById(R.id.btn);
        btn.setOnClickListener(this);
        view_pager = (ViewPager) findViewById(R.id.view_pager);
        ll = (LinearLayout) findViewById(R.id.ll);
    }

    @Override
    public void onClick(View v) {
        switch (v.getId()) {
            case R.id.btn:
                break;
        }
    }

	//我是通过这个请求的引导页数据,本地图片引导页的同学忽略这里,自己建个本地图片的集合
    private void getGuide() {
        OkHttpClient client = new OkHttpClient();
        Request request = new Request.Builder()
                .url(url)
                .get()
                .build();
        client.newCall(request).enqueue(new Callback() {
            @Override
            public void onFailure(Call call, IOException e) {

            }

            @Override
            public void onResponse(Call call, Response response) throws IOException {
                String res = response.body().string();
                try {
                    JSONObject object = new JSONObject(res);
                    if (object.optInt("code") == 200) {
                        ydy = new Gson().fromJson(res, Ydy.class);
                        runOnUiThread(new Runnable() {
                            @Override
                            public void run() {
                            	//因为网络请求数据时我使用了异步,所以就选择把在家引导页图片的方法写在这里
                                setGuide();
                            }
                        });
                    }
                } catch (JSONException e) {
                    e.printStackTrace();
                }
            }
        });
    }

    private void setGuide() {
        fragments = new ArrayList<>();
        for (int i = 0; i < ydy.getRows().size(); i++) {
            GuideFragment fragment = new GuideFragment(ydy.getRows().get(i).getImgUrl());
            fragments.add(fragment);
            //这个按钮就是用来做引导页指示器的
            //我前段时间学习的时候看到大多数人都是直接写死在布局文件
            //所以就试着能不能跟随我网络请求多少就有多少指示器按钮
            ImageButton imageButton = new ImageButton(this);
            imageButton.getBackground().setAlpha(0);
            imageButton.setImageResource(R.drawable.btn_off);
            ll.addView(imageButton);
        }
        ImageButton imageButton = (ImageButton) ll.getChildAt(0);
        imageButton.setImageResource(R.drawable.btn_on);

        view_pager.setAdapter(new MyAdapter(getSupportFragmentManager(), 0));   //设置适配器
        view_pager.addOnPageChangeListener(new myOnClick());    //添加页面切换的监听事件
    }

    private class MyAdapter extends FragmentPagerAdapter {
        public MyAdapter(@NonNull FragmentManager fm, int behavior) {
            super(fm, behavior);
        }

        @NonNull
        @Override
        public Fragment getItem(int position) {
            return fragments.get(position);
        }

        @Override
        public int getCount() {
            return fragments.size();
        }
    }

    private class myOnClick implements ViewPager.OnPageChangeListener {
        @Override
        public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {

        }

        @Override
        public void onPageSelected(int position) {
            if (position == fragments.size() - 1) {
                btn.setVisibility(View.VISIBLE);
            } else {
                btn.setVisibility(View.GONE);
            }
            //循环,ll.getChildCount()是获取了这个布局里面的子控件个数
            for (int i = 0; i < ll.getChildCount(); i++) {
                ImageButton imageButton1 = (ImageButton) ll.getChildAt(i);
                //改变所选中的引导页对应的指示器按钮的图片以提示位置
                if (i == position) {
                    imageButton1.setImageResource(R.drawable.btn_on);
                } else {
                    imageButton1.setImageResource(R.drawable.btn_off);
                }
            }
        }

        @Override
        public void onPageScrollStateChanged(int state) {

        }
    }
}

4.本人才学了2个月不到,不足之处定是有的,这篇文章肯定也有很多写错的地方,劳请各位指出,谢谢

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值