2.2.3 图片类控件的使用

作者: 常思行 | 来源:发表于2018-05-31 09:55 被阅读45次

    ImageView、ZoomButton、ImageButton、(ImageSwitcher ):这些都属于图片类控件,这里重点介绍下 ImageView 的用法。

    一、ImageView

    ImageView继承自View组件,主要功能是用于显示图片。

    栗子:图片浏览器

    • Java代码:
    public class MainActivity extends Activity
    {
        // 定义一个访问图片的数组
        int[] images = new int[]{
                R.drawable.lijiang,
                R.drawable.qiao,
                R.drawable.shuangta,
                R.drawable.shui,
                R.drawable.xiangbi,
        };
        // 定义默认显示的图片
        int currentImg = 2;
        // 定义图片的初始透明度
        private int alpha = 255;
        @Override
        public void onCreate(Bundle savedInstanceState)
        {
            super.onCreate(savedInstanceState);
            setContentView(R.layout.main);
            final Button plus = (Button) findViewById(R.id.plus);
            final Button minus = (Button) findViewById(R.id.minus);
            final ImageView image1 = (ImageView) findViewById(R.id.image1);
            final ImageView image2 = (ImageView) findViewById(R.id.image2);
            final Button next = (Button) findViewById(R.id.next);
            // 定义查看下一张图片的监听器
            next.setOnClickListener(new View.OnClickListener()
            {
                @Override
                public void onClick(View v)
                {
                    // 控制ImageView显示下一张图片
                    image1.setImageResource(
                            images[++currentImg % images.length]);
                }
            });
            // 定义改变图片透明度的方法
            View.OnClickListener listener = new View.OnClickListener()
            {
                @Override
                public void onClick(View v)
                {
                    if (v == plus)
                    {
                        alpha += 20;
                    }
                    if (v == minus)
                    {
                        alpha -= 20;
                    }
                    if (alpha >= 255)
                    {
                        alpha = 255;
                    }
                    if (alpha <= 0)
                    {
                        alpha = 0;
                    }
                    // 改变图片的透明度
                    image1.setImageAlpha(alpha);
                }
            };
            // 为两个按钮添加监听器
            plus.setOnClickListener(listener);
            minus.setOnClickListener(listener);
            image1.setOnTouchListener(new View.OnTouchListener()
            {
                @Override
                public boolean onTouch(View view, MotionEvent event)
                {
                    BitmapDrawable bitmapDrawable = (BitmapDrawable) image1
                            .getDrawable();
                    // 获取第一个图片显示框中的位图
                    Bitmap bitmap = bitmapDrawable.getBitmap();
                    System.out.println(bitmap.getWidth());
                    System.out.println(image1.getWidth());
                    // bitmap图片实际大小与第一个ImageView的缩放比例
                    double scale = 1.0 * bitmap.getHeight() / image1.getHeight();
                    // 获取需要显示的图片的开始点
                    int x = (int) (event.getX() * scale);
                    int y = (int) (event.getY() * scale);
                    if (x + 120 > bitmap.getWidth())
                    {
                        x = bitmap.getWidth() - 120;
                    }
                    if (y + 120 > bitmap.getHeight())
                    {
                        y = bitmap.getHeight() - 120;
                    }
                    // 显示图片的指定区域
                    image2.setImageBitmap(Bitmap.createBitmap(bitmap
                        , x, y, 120, 120));
                    image2.setImageAlpha(alpha);
                    return false;
                }
            });
        }
    }
    
    • 布局文件main.xml
    <?xml version="1.0" encoding="utf-8"?>
    <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
        android:orientation="vertical"
        android:layout_width="match_parent"
        android:layout_height="match_parent">
        <LinearLayout
            android:orientation="horizontal"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:gravity="center">
            <Button android:id="@+id/plus"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="增大透明度"/>
            <Button android:id="@+id/minus"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="降低透明度"/>
            <Button android:id="@+id/next"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="下一张"/>
        </LinearLayout>
        <!-- 定义显示图片整体的ImageView -->
        <ImageView android:id="@+id/image1"
            android:layout_width="wrap_content"
            android:layout_height="280dp"
            android:src="@drawable/shuangta"
            android:scaleType="fitCenter"/>
        <!-- 定义显示图片局部细节的ImageView -->
        <ImageView android:id="@+id/image2"
            android:layout_width="120dp"
            android:layout_height="120dp"
            android:background="#00f"
            android:layout_margin="10dp"/>
    </LinearLayout>
    

    下面给出常用属性:

    常用属性
    • android:adjustViewBounds:用于设置ImageView是否调整自己的边界来保持所显示图片的长宽比。
    • android:maxHeight:设置ImageView的最大高度,需要设置
    • android:adjustViewBounds:属性值为true,否则不起作用。
    • android:maxWidth:设置ImageView的最大宽度,需要设置 android:adjustViewBounds属性值为true,否则不起作用。
    • android:scaleType:用于设置所显示的图片如何缩放或移动以适应ImageView的大小。

    其属性值可以是:
    matrix:使用matrix方式进行缩放
    fitXY:对图片横向、纵向独立缩放,使得该图片完全适应于该ImageView,图片的纵横比可能会改变
    fitStart:保持纵横比缩放图片,直到该图片能完全显示在ImageView中,缩放完成后该图片放在ImageView的左上角
    fitEnd:保持纵横比缩放图片,直到该图片能完全显示在ImageView中,缩放完成后该图片放在ImageView的右下角
    center:把图像放在ImageView的中间,但不进行任何缩放
    fitCenter:保持纵横比缩放图片,直到该图片能完全显示在ImageView中,缩放完成后该图片放在ImageView的中央
    centerCrop:保持纵横比缩放图片,以使得图片能完全覆盖ImageView 或
    centerInside:保持纵横比缩放图片,以使得ImageView能完全显示该图片

    • android:src:用于设置ImageView所显示的Drawable对象的ID,例如:设置显示保存在res/drawable目录下的名称为flower.jpg的图片,可以将属性值设置为android:src="@drawable/flower
    • android:tint:用于为图片着色,其属性值可以是 “#rgb”、“#argb”、“#rrggbb”或“#aarrggbb” 表示的颜色值。

    问:src属性和background属性有何区别?

    ① background通常指的都是背景,而src指的是内容!!
    ② 当使用src填入图片时,是按照图片大小直接填充,并不会进行拉伸
    而使用background填入图片,则是会根据ImageView给定的宽度来进行拉伸

    感谢优秀的你跋山涉水看到了这里,不如关注下让我们永远在一起!

    相关文章

      网友评论

        本文标题:2.2.3 图片类控件的使用

        本文链接:https://www.haomeiwen.com/subject/aonfsftx.html