Android中图片的左右切换随处可见,今天我也试着查阅资料试着做了一下,挺简单的一个小Demo,却也发现了一些问题,话不多说,上代码~:

  1. 使用了3个xml文件作为ViewPager的滑动page,布局都是相同的,如下只展示其中之一:

     <?xml version="1.0" encoding="utf-8"?>
    <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    >
    <ImageView
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:scaleType="centerCrop"
    android:src="@mipmap/view1"/> </LinearLayout>

    只是用了一个ImageView作为显示图片的容器

  2. 主页面布局:
     <?xml version="1.0" encoding="UTF-8"?>
    
     <RelativeLayout android:orientation="vertical"
    android:layout_height="match_parent"
    android:layout_width="match_parent"
    xmlns:android="http://schemas.android.com/apk/res/android"> <!-- 切换卡 --> <android.support.v4.view.ViewPager
    android:layout_height="wrap_content"
    android:layout_width="match_parent"
    android:id="@+id/viewPager"></android.support.v4.view.ViewPager> <!-- 点点 --> <LinearLayout
    android:orientation="horizontal"
    android:layout_height="wrap_content"
    android:layout_width="fill_parent"
    android:id="@+id/viewGroup"
    android:layout_alignParentBottom="true"
    android:gravity="center_horizontal"
    android:layout_marginBottom="40dp"></LinearLayout>
    </RelativeLayout>
  3. 接下来就是主函数的的代码了:
     package com.yztc.lx.homework;
    
     import android.app.Activity;
    import android.os.Bundle;
    import android.support.v4.view.PagerAdapter;
    import android.support.v4.view.ViewPager;
    import android.view.LayoutInflater;
    import android.view.ViewGroup.LayoutParams;
    import android.view.View;
    import android.view.ViewGroup;
    import android.widget.ImageView; import java.util.ArrayList;
    import java.util.List; /**
    * Created by Lx on 2016/8/6.
    */ public class Layout1Activity extends Activity {
    private ViewPager viewPager;
    private PagerAdapter adapter;
    private List<View> viewPages = new ArrayList<>(); //包裹点点的LinearLayout
    private ViewGroup group;
    private ImageView imageView;
    //定义一个ImageVIew数组,来存放生成的小园点
    private ImageView[] imageViews; @Override
    protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.layout1); initView();
    initPageAdapter();
    initPointer();
    initEvent();
    } //为控件绑定事件,绑定适配器
    private void initEvent() {
    viewPager.setAdapter(adapter);
    viewPager.addOnPageChangeListener(new GuidePageChangeListener());
    } //初始化ViewPager
    private void initPageAdapter() {
    /**
    * 对于这几个想要动态载入的page页面,使用LayoutInflater.inflate()来找到其布局文件,并实例化为View对象
    */
    LayoutInflater inflater = LayoutInflater.from(this);
    View page1 = inflater.inflate(R.layout.page1, null);
    View page2 = inflater.inflate(R.layout.page2, null);
    View page3 = inflater.inflate(R.layout.page3, null); //添加到集合中
    viewPages.add(page1);
    viewPages.add(page2);
    viewPages.add(page3); adapter = new PagerAdapter() {
    //获取当前界面个数
    @Override
    public int getCount() {
    return viewPages.size();
    } //判断是否由对象生成页面
    @Override
    public boolean isViewFromObject(View view, Object object) {
    return view == object;
    } @Override
    public void destroyItem(ViewGroup container, int position, Object object) {
    container.removeView(viewPages.get(position));
    } //返回一个对象,这个对象表明了PagerAdapter适配器选择哪个对象放在当前的ViewPager中
    @Override
    public Object instantiateItem(ViewGroup container, int position) {
    View view = viewPages.get(position);
    container.addView(view);
    return view;
    }
    };
    } //绑定控件
    private void initView() {
    viewPager = (ViewPager) findViewById(R.id.viewPager);
    group = (ViewGroup) findViewById(R.id.viewGroup);
    } //初始化下面的小圆点的方法
    private void initPointer() {
    //有多少个界面就new多长的数组
    imageViews = new ImageView[viewPages.size()];
    for (int i = 0; i < imageViews.length; i++) {
    imageView = new ImageView(this);
    //设置控件的宽高
    imageView.setLayoutParams(new LayoutParams(25, 25));
    //设置控件的padding属性
    imageView.setPadding(20, 0, 20, 0);
    imageViews[i] = imageView;
    //初始化第一个page页面的图片的原点为选中状态
    if (i == 0) {
    //表示当前图片
    imageViews[i].setBackgroundResource(R.mipmap.page_indicator_focused);
    /**
    * 在java代码中动态生成ImageView的时候
    * 要设置其BackgroundResource属性才有效
    * 设置ImageResource属性无效
    */ } else {
    imageViews[i].setBackgroundResource(R.mipmap.page_indicator_unfocused);
    }
    group.addView(imageViews[i]);
    }
    } //ViewPager的onPageChangeListener监听事件,当ViewPager的page页发生变化的时候调用
    public class GuidePageChangeListener implements ViewPager.OnPageChangeListener {
    @Override
    public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) { } //页面滑动完成后执行
    @Override
    public void onPageSelected(int position) {
    //判断当前是在那个page,就把对应下标的ImageView原点设置为选中状态的图片
    for (int i = 0; i < imageViews.length; i++) {
    imageViews[position].setBackgroundResource(R.mipmap.page_indicator_focused);
    if (position != i) {
    imageViews[i].setBackgroundResource(R.mipmap.page_indicator_unfocused);
    }
    }
    } //监听页面的状态,0--静止 1--滑动 2--滑动完成
    @Override
    public void onPageScrollStateChanged(int state) { }
    } }
  4. 这样,一个简单地滑动图片的Demo就完成了,需要注意的地方有:在java代码中生成ImageView的时候,如果想为其设置显示的图片,要使用setBackgroundResource()方法而不是setImageResource()方法

Android随笔--使用ViewPager实现简单地图片的左右滑动切换的更多相关文章

  1. Android开发之ViewPager+ActionBar+Fragment实现响应式可滑动Tab

     今天我们要实现的这个效果呢,在Android的应用中十分地常见,我们可以看到下面两张图,无论是系统内置的联系人应用,还是AnyView的阅读器应用,我们总能找到这样的影子,当我们滑动屏幕时,Tab可 ...

  2. [js开源组件开发]js轮播图片支持手机滑动切换

    js轮播图片支持手机滑动切换 carousel-image 轮播图片,支持触摸滑动. 例子见DEMO http://www.lovewebgames.com/jsmodule/carousel-ima ...

  3. jQuery左侧图片右侧文字滑动切换代码

    分享一款jQuery左侧图片右侧文字滑动切换代码.这是一款基于jQuery实现的列表图片控制图片滑动切换代码.效果图如下: 在线预览   源码下载 实现的代码. html代码: <div cla ...

  4. Android开发之ViewPager的简单使用

    ViewPager是V4包中的,如果你的编译器敲不出ViewPager,那么你就需要添加,看下面: 第一步:点击+号 第二步:选择第一个Library 第三步:添加这个包: 然后点击ok-->o ...

  5. Android自定义顶部栏及侧滑菜单和fragment+viewpag滑动切换的实现

    嘿嘿嘿,关于android滑动的操作,是不是经常都会用到呢. 我肯定也要学习一下啦. https://blog.csdn.net/u013184970/article/details/82882107 ...

  6. Fragment+ViewPager实现仿微信点击和滑动切换界面

    这是在我写的新闻App中实现的界面切换 贴出切换界面的主要代码: xml代码: <span style="font-size:14px;"> <android.s ...

  7. Android中用URL模拟一个简单的图片加载器

    首先,需要添加权限. <uses-permission android:name="android.permission.INTERNET"/> 整体代码如下: pac ...

  8. Android 使用TabLayout、ViewPager和Fragment实现顶部菜单可滑动切换

    效果图如下 首先,要使用控件需要添加design library,在Android Studio中添加 compile 'com.android.support:design:23.4.0' 然后是布 ...

  9. Android典型界面设计——ViewPage+Fragment实现区域顶部tab滑动切换

    一.问题描写叙述 本系列将结合案例应用,陆续向大家介绍一些Android典型界面的设计,首先说说tab导航,导航分为一层和两层(底部区块+区域内头部导航).主要实现方案有RadioGroup+View ...

随机推荐

  1. Linux基础--例行工作

    1.仅进行一次的工作排程--at at的工作情况其实是这样的: 1)先找寻/etc/at.allow这个档案,写在这个档案中的使用者才能使用at,没有在这个档案中的使用者则不能使用at(即使没有写在a ...

  2. 通过表达式、函数给React组件属性赋值

    一.需求 当有传属性name的值时,则显示Hello "name",否则显示Hello World 二.4种方式的代码实现 1.通过三元运算符 <!DOCTYPE html& ...

  3. ubuntu下搭建cocos2dx编程环境-下

         前两篇介绍了cocos2d-x 下linux开发环境配置和android 环境配置问题.在这其中遇到很多问题,所以最后一篇分享一下在处理这些问题时,我是如何解决的,是怎么想的.同时总结一些解 ...

  4. CentOS启动和停止服务详解

    服务简介Linux 系统服务是在Linux启 动时自动加载,并在Linux退出时自动停止的系统任务.在Linux 启动过程中,我们可以看得很多“starting … ”提示信息,该信息表示正在启动系统 ...

  5. Linux中__init、__devinit等内核优化宏【转】

    转自:http://blog.csdn.net/joker0910/article/details/7171626 内核使用了大量不同的宏来标记具有不同作用的函数和数据结构.如宏__init .__d ...

  6. Android控件系列之CheckBox

    学习目的: 1.掌握在Android中如何建立CheckBox 2.掌握CheckBox的常用属性 3.掌握CheckBox选中状态变换的事件(监听器) CheckBox简介: CheckBox和Bu ...

  7. iPhone(iOS设备) 无法更新或恢复时, 如何进入恢复模式

    在更新或恢复 iPhone  时,如果遇到以下所列问题之一.可能就要将设备置于恢复模式,并尝试重新恢复设备. 设备不断地重新启动,但从未显示主屏幕. 无法完成更新或恢复,且 iTunes 不再能识别设 ...

  8. SQLServer2008 行转列2

    with a as ( select numb,name,row_number() over( partition by numb order by name desc) rowid from fen ...

  9. MongoDB 学习笔记(三) MongoDB (replica set) 集群配置

    MongoDB Replica Sets的结构类似于以集群,完全可以把他当成一个集群,因为他确实与集群实现的作用是一样的:如果其中一个节点出现故障,其他的节点会马上将业务接管过来.而无需停机操作 Mo ...

  10. 《OD大数据实战》HBase整合MapReduce和Hive

    一.HBase整合MapReduce环境搭建 1. 搭建步骤1)在etc/hadoop目录中创建hbase-site.xml的软连接.在真正的集群环境中的时候,hadoop运行mapreduce会通过 ...