ViewPager添加小圆点

ViewPager添加小圆点很简单,但是如果是网络图片可能就不太好做了,所以我这里给出一种方法,当然你也可以用其他的

1.主界面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="com.cqytjr.www.cheji.Activity.BigImageActivity">

    <android.support.v4.view.ViewPager
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:id="@+id/viewpager">

    </android.support.v4.view.ViewPager>
    <LinearLayout
        android:layout_width="wrap_content"
        android:layout_height="40dp"
        android:id="@+id/ll_pager_num"
        android:orientation="horizontal"
        android:layout_alignParentBottom="true"
        android:layout_marginBottom="45dp"
        android:layout_centerHorizontal="true"
        >

    </LinearLayout>

</RelativeLayout>

activity代码:

public class BigImageActivity extends BaseActivity {

    private ViewPager pager;
    private List <ImageView>list;
    private LinearLayout mNumLayout;
    private List<Button>pagerList;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_big_image);
        initView();
    }

    @Override
    protected void initView() {
        super.initView();

        initWithData();

        mNumLayout = (LinearLayout) findViewById(R.id.ll_pager_num);
        pagerList = new ArrayList<Button>();

        Bitmap bitmap = BitmapFactory.decodeResource(getResources(), R.drawable.ic_page_indicator);
        for (int i = 0; i < list.size(); i++) {
            Button bt = new Button(this);
            LinearLayout.LayoutParams params = new LinearLayout.LayoutParams(new ViewGroup.LayoutParams(ViewGroup.LayoutParams.WRAP_CONTENT, ViewGroup.LayoutParams.WRAP_CONTENT));

           //为小圆点左右添加间距
            params.leftMargin = 10;
            params.rightMargin = 10;
            //手动给小圆点一个大小
            params.height = bitmap.getWidth();
            params.width = bitmap.getHeight();

//            bt.setLayoutParams(new ViewGroup.LayoutParams(bitmap.getWidth(),bitmap.getHeight()));
//            bt.setBackgroundResource(R.drawable.ic_page_indicator);
            mNumLayout.addView(bt,params);
            pagerList.add(bt);
        }
        pager = (ViewPager)findViewById(R.id.viewpager);

        PagerAdapter adapter = new PagerAdapter() {
            @Override
            public int getCount() {
                return list.size();
            }

            @Override
            public boolean isViewFromObject(View view, Object object) {
                return view == object;
            }

            @Override
            public Object instantiateItem(ViewGroup container, int position)
            {

                container.addView(list.get(position));

                return list.get(position);
            }

            @Override
            public void destroyItem(ViewGroup container, int position,
                                    Object object)
            {

                container.removeView(list.get(position));
            }

        };

        pager.addOnPageChangeListener(new ViewPager.OnPageChangeListener() {
            @Override
            public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {

            }

            @Override
            public void onPageSelected(int position) {
                choseItem(position);
            }

            @Override
            public void onPageScrollStateChanged(int state) {

            }
        });

        pager.setAdapter(adapter);
        pager.setCurrentItem(0);
        choseItem(0);

    }
    public void initWithData(){

        int[]strings = {R.drawable.ic_test_0,R.drawable.ic_test_1,R.drawable.ic_test_2,
                R.drawable.ic_test_3,R.drawable.ic_test_4,R.drawable.ic_test_5,R.drawable.ic_test_6};

        list = new ArrayList<ImageView>();
        for (int i=0;i<strings.length;i++){

            ImageView imageView = new ImageView(getApplicationContext());
            imageView.setScaleType(ImageView.ScaleType.CENTER_CROP);
            imageView.setImageResource(strings[i]);
            list.add(imageView);
        }

    }

    private void choseItem(int i){

        Log.d("BigImageActivity",i+"===========");

        for (Button button:pagerList){
            button.setBackgroundResource(R.drawable.ic_page_indicator);
        }
        Button button = pagerList.get(i);
        button.setBackgroundResource(R.drawable.ic_page_indicator_focused);

    }

}
时间: 2024-11-03 12:50:45

ViewPager添加小圆点的相关文章

Viewpager小圆点

public class MainActivity extends Activity {    private ViewPager viewpager;    private LinearLayout l;    private int[] img = { R.drawable.q, R.drawable.w, R.drawable.e,            R.drawable.r };    private ArrayList<ImageView> dos;    private Arr

新手导航页(小圆点

让小红点随滑动的距离而移动(有动画效果),利用ViewPager的监听事件setOnPageChangeListener来实现 //注意测量小圆点边距时要layout完才能测量,否则为0(自定义View的三个过程) public class GuideActivity extends AppCompatActivity { private ViewPager mViewPager; private ArrayList<ImageView> mImageViews;//ImageView集合 /

2017-05-17 js动态生成轮播图小圆点

从今天开始,把自己做的笔记转移到博客园: 今晚复习了一下动态创建轮播图小圆点做了一下小的笔记: 1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>2017-05-17 js动态生成轮播图小圆点</title> 6 <!-- author:ishou Mr丶Zhu --> 7

banner广告及view pager 的小圆点指示器

一.主界面 package com.example.t; import android.app.Activity;import android.os.Bundle;import android.support.v4.view.ViewPager;import android.support.v4.view.ViewPager.OnPageChangeListener; public class MainActivity extends Activity implements OnPageChan

Android 利用ViewPager实现底部圆点导航左右滑动效果以及Fragment页面切换

上一篇博文我们介绍了利用ViewPager和Fragment实现顶部滑块左右滑动效果,具体参考(http://blog.csdn.net/a123demi/article/details/39480385). 而本篇博文将实例讲解利用ViewPager实现底部圆点导航左右滑动效果,以及被滑动界面实现监听事件,同时通过Fragment实现页面的切换. 对于该效果的实现,需要实现以下几个问题: 1. 底部圆点加载和实现方法? 2. 怎样实现左右滑动效果? 3. 被滑动页面,怎样实现监听事件? 4.

Android 自动循环滚动图片(广告)附带导航小圆点

用viewpage实现了滚动图片,自动循环的效果,附带导航的小圆点 效果图如下: 准备工作: 下载我打包好的jar包,放入项目的libs文件夹下即可使用 下载地址:http://download.csdn.net/detail/u012027644/8744019 使用方法: Activity的代码: public class MainActivity extends Activity { MyImgScroll myPager; // 图片容器 LinearLayout ovalLayout;

如何在网址之前添加小图标

如何在网址之前添加小图标:本章节介绍一下如何在网址前面添加一个小图标,现在知名网站都会有这个小图标,非知名网站也有很多添加这样的小图标,至于有没有好处这里不好说,至少比较美观,下面就就介绍一下如何实现此效果.方法如下:在头部中添加如下代码即可: <link rel='icon' href='antzone.ico' type='image/x-ico' /> 图标的格式必须是.ico格式,在网上有很多在线生成工具. 原文地址是:http://www.softwhy.com/forum.php?

去除li小圆点以及解决其空格问题

不管是ul还是ol中的li前面始终有个小圆点,以前没有发现问题,都是直接给ul增加list-style:none;属性,可今天屡试不爽的属性出现问题了,上图 通过两张截图可以清晰的看到虽然小圆点去掉了,但是还是占着位置.典型的占着**不**,而且还影响视图效果,怎么办?先看看样式,里面没有margin或者padding这类的东东,然后看看盒模型,果然: 从盒模型可以看到ul有个padding,外围有margin,那就把padding去掉试试. 结果显示终于正常了,也没有占位了,完美!! 总结:修

公众号群发文章支持添加小程序

微信小程序深夜凌晨放大招,公众号群发文章支持添加小程序,以下是微信公众平台的公告:为了方便用户在阅读文章时使用公众号提供的服务,公众号群发文章支持添加小程序. 公众号可将已关联的小程序添加到群发文章的正文中,点击后打开小程序. 可自定义小程序卡片的标题和图片,指定小程序打开的页面. 支持所有公众号群发文章的正文里添加小程序. 不知道怎么在公众号图文消息里添加小程序卡片?看这里: ①登录公众号后台,点击右侧“小程序”②选择已关联的小程序 ③确认展示方式(查看样式效果)④编辑标题.图片和小程序页面,