17 UI组件之 Basic View- ImageView

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了17 UI组件之 Basic View- ImageView相关的知识,希望对你有一定的参考价值。

UI组件之 Basic View- ImageView-图片浏览器练习

ImageView


 

小案例1(点击可以切换图片——有序图片浏览):

代码:

main.xml:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:orientation="vertical" >

    <ImageView
        android:id="@+id/imageView1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" 
        android:src="@drawable/a1"/>
    
</LinearLayout>

Test_imageViewActivity.java:

package test.imageView;

import android.app.Activity;
import android.os.Bundle;
import android.view.View;
import android.view.View.OnClickListener;
import android.widget.ImageView;

public class Test_imageViewActivity extends Activity {
    //该数组为4张图片进行了简单的排序
    private int[] a = new int[]{
            R.drawable.a1,
            R.drawable.a2,
            R.drawable.a3,
            R.drawable.a4
            
    };
    //设定简单计数器,
    private int count=0;
    
    
    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
      
        setContentView(R.layout.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=0;
                }
                view.setImageResource(a[++count]);
                
            }
            
            
        });
    }
}

运行结果:

       

 


 

小案例2(点击可以切换图片——点击图片左边正序浏览图片,点击图片右边逆序浏览图片):

代码:

main.xml:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:orientation="vertical" >

    <ImageView
        android:id="@+id/imageView1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" 
        android:src="@drawable/a1"/>
    
</LinearLayout>

Test_imageViewActivity.java:

package test.imageView;

import android.app.Activity;
import android.os.Bundle;
import android.view.MotionEvent;
import android.view.View;
import android.view.View.OnClickListener;
import android.view.View.OnTouchListener;
import android.widget.ImageView;

public class Test_imageViewActivity extends Activity {
    //该数组为4张图片进行了简单的排序
    private int[] a = new int[]{
            R.drawable.a1,
            R.drawable.a2,
            R.drawable.a3,
            R.drawable.a4
            
    };
    //设定简单计数器,
    private int count=0;
    
    
    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
      
        setContentView(R.layout.main);
        
        ImageView imageView = (ImageView)findViewById(R.id.imageView1);
        
       
        
        //如何获取到屏幕的宽度
        final int width = this.getWindowManager().getDefaultDisplay().getWidth();        
        imageView.setOnTouchListener(new OnTouchListener(){
            public boolean onTouch(View v, MotionEvent event) {
                 //如何在图片点击的过程中,获得点击x轴的坐标
                int x =(int) event.getX();
                ImageView view =(ImageView) v;
                if(x>=(width/2)){
                    //右侧
                    if(count==3){
                        count=-1;//当++count之后就变为0了
                    }
                    view.setImageResource(a[++count]);
                }else{
                    //左侧
                    if(count==0){
                        count=4;//当--count之后就变为3了
                    }
                    view.setImageResource(a[--count]);
                }
                return false;
            }
            
        });
    }
}

运行结果:

当点击图片的左边进行逆序浏览,点击图片右边进行正序浏览;

 

以上是关于17 UI组件之 Basic View- ImageView的主要内容,如果未能解决你的问题,请参考以下文章

android源码分析之View的事件分发(上)

Android之UI View与ViewGroup

Android开发之自己定义UI组件和属性

异步线程之AsyncTask

vue之mvvm的理解

微信小程序 | 51,live新课“小程序UI容器组件”的课堂计划