zoukankan      html  css  js  c++  java
  • 第17讲- UI常用组件之ImageView图片浏览

    17讲 UI常用组件之ImageView图片浏览

    二、图片浏览ImageView

    ImageView就是一个用来显示图片的视图;

    ImageView常见属性

    常见属性

    对应方法

    说明

    android:adjustViewBounds

    setAdjustViewBounds(boolean)

    是否保持宽高比。需要与maxWidth、MaxHeight一起使用,单独使用没有效果。

    android:maxHeight

    set MaxHeight(int)

    设置View的最大高度。需要与setAdjustViewBounds一起使用。

    android:maxWidth

    set MaxWidth(int)

    设置View的最大宽度。同上。

    android:scaleType

    setScaleType(ImageView. ScaleType)

    设置图片的填充方式。

    android:src

    setImageResource(int)

    设置View的drawable(如图片,也可以是颜色,但是需要指定View的大小)

     

    setAlpha (int alpha)

    设置透明度

    setImageBitmap (Bitmap bm)

    设置位图作为该 ImageView 的内容。

    setImageDrawable (Drawable drawable)

    设置可绘制对象为该 ImageView 显示的内容。

    setImageResource (int resId)

    设置指定ID的资源为该 ImageView 显示的内容。

    setImageURI (Uri uri)

    设置指定的 URI 为该 ImageView 显示的内容。

    setSelected (boolean selected)

    设置视图的选中状态。

     

    1.显示图片:

    在activity_main.xml中添加一个ImageView,将图片a1.jpg放置在res中的drawable文件夹中;

    在activity_main.xml中编写程序

       <ImageView

           android:id="@+id/imageView1"

           android:layout_width="wrap_content"

           android:layout_height="wrap_content"

           android:src="@drawable/a1" />

    2.实现点击图片进行切换

    首先,将图片a1.jpg, a2.jpg, a3.jpg, a4.jpg放置在res中的drawable文件夹中;

    然后,将图片进行排序,将其引用放置在数组中;

    private int[] a= new int[]{

    R.drawable.a1,

    R.drawable.a2,

    R.drawable.a3,

    R.drawable.a4,

    };

    设置切换用的计数器count。

    private int count=0;

    protected voidonCreate(Bundle savedInstanceState) {

             super.onCreate(savedInstanceState);

             setContentView(R.layout.activity_main);

    ImageView imageView=(ImageView) findViewById(R.id.imageView1);

    imageView.setOnClickListener(new OnClickListener() {

    public void onClick(View v) {

    ImageView view=(ImageView) v;

    if(count==3){                          //当到达最后一张图片时,在点击将切换到第一张图片

    count= -1;

    }

    view.setImageResource(a[++count]);

    }

    });

    }

    3. 实现点击图片进行左右切换:

    点击图片左边,切换到前一张图片;点击图片右边,切换到下一张图片。

    需要解决: a1.如何在图片点击过程中,获得点击处X轴坐标; a2.获取屏幕宽度。

    ImageView imageView=(ImageView)findViewById(R.id.imageView1);

    Final int width =this.getWindowManager().getDefaultDisplay().getWidth();

    //利用touch方法可以获得点击现场的信息。

    imageView.setOnTouchListener(newOnTouchListener() {

                       publicboolean onTouch(View v, MotionEvent event) {

                                //如何在图片点击过程中,获得点击处X轴坐标

                                intx = (int) event.getX();

                                ImageViewview=(ImageView) v;

                                if(x>=(width/2)){

                                         if(count==3){

                                                   count=-1;

                                         }

                                         view.setImageResource(a[++count]);

                                }else{

                                         if(count==0){

                                                   count=4;

                                         }

                                         view.setImageResource(a[--count]);

                                }

                                returnfalse;

                       }

    });

  • 相关阅读:
    Vue项目和微信小程序项目的区别与比较
    在Vue中应该如何封装Axios 管理API接口
    Vue2.x 项目踩坑笔记
    微信小程序日常踩坑笔记
    面试题之JavaScript 请写一个深度克隆的函数
    面试题之JavaScript 请编写实现一个对js类型检测函数(支持检测基本类型,对象,函数,正则,时间等)
    面试题之 HTML && CSS && JavaScript 总结
    面试题之JavaScript 有一个url 'http://www.youdao.com/newcard.html?sid=50&a=5&add=9&type=all',请写一个获取url中'?'后制定参数值的函数
    面试题之JavaScript 请给Array本地对象增加一个原型方法,它用于删除数组条目中重复的条目(可能有多个),返回值是一个包含被删除的重复条目的新数组。
    面试题之JavaScript 正则相关题
  • 原文地址:https://www.cnblogs.com/anyuan9/p/6171604.html
Copyright © 2011-2022 走看看