zoukankan      html  css  js  c++  java
  • android 显示图片的指定位置图像 ImageView ImageButton

    问题出现

    UI提供了一些图标素材,但是是在一张图片上 如图:

    这里写图片描述

    产品需要在页面下方横排显示三个按钮

    这里写图片描述

    解决方案

    废话不多说,网上搜了一下,大多都是通过代码重新绘制。因为我比较粗俗,所以自己找到了一种解决办法。

    心历路程

    设置scaleType的值来实现

    根据查阅资料了解Image相关view的属性值了解到

    对于android:scaleType属性,因为关于图像在ImageView中的显示效果,所以有如下属性值可以选择:

    • matrix:使用matrix方式进行缩放。
    • fitXY:横向、纵向独立缩放,以适应该ImageView。
    • fitStart:保持纵横比缩放图片,并且将图片放在ImageView的左上角。
    • fitCenter:保持纵横比缩放图片,缩放完成后将图片放在ImageView的中央。
    • fitEnd:保持纵横比缩放图片,缩放完成后将图片放在ImageView的右下角。
    • center:把图片放在ImageView的中央,但是不进行任何缩放。
    • centerCrop:保持纵横比缩放图片,以使图片能完全覆盖ImageView。
    • centerInside:保持纵横比缩放图片,以使得ImageView能完全显示该图片。

    由于我这里UI提供的图片比较特殊,所以第一张和第二张的图片分别可以通过设置 matrixcenter获取到

      <ImageButton
            android:id="@+id/qq_login"
            android:layout_width="wrap_content"
            android:layout_height="47dp"
            android:layout_marginBottom="100dp"
            android:layout_marginLeft="100dp"
            android:layout_marginStart="100dp"
            android:background=""
            android:contentDescription="@string/qq_login_content_description"
            android:scaleType="matrix"
            app:layout_constraintBottom_toBottomOf="parent"
            app:layout_constraintStart_toStartOf="parent"
            app:srcCompat="@drawable/login" />

    这里写图片描述

        <ImageButton
            android:id="@+id/wx_login"
            android:layout_width="wrap_content"
            android:layout_height="47dp"
            android:layout_marginBottom="100dp"
            android:layout_marginEnd="8dp"
            android:layout_marginLeft="8dp"
            android:layout_marginRight="8dp"
            android:layout_marginStart="8dp"
            android:background=""
            android:contentDescription="@string/wb_login_content_description"
            android:scaleType="centerCrop"
            app:layout_constraintBottom_toBottomOf="parent"
            app:layout_constraintEnd_toStartOf="@+id/wb_login"
            app:layout_constraintStart_toEndOf="@+id/qq_login"
            app:srcCompat="@drawable/login" />
    

    这里写图片描述

    到上面的时候,心里还是美滋滋,只要这样下去,不超过5分钟,我的图就画好了.可是接着尴尬的问题出现了

    第三张的图片怎么取?? WTF??? 此处省略18分钟


    终极方案,完美解决

        <ImageButton
            android:id="@+id/qq_login"
            android:layout_width="47dp"
            android:layout_height="47dp"
            android:paddingTop="94dp"
            android:layout_marginBottom="100dp"
            android:layout_marginLeft="100dp"
            android:layout_marginStart="100dp"
            android:background="@null"
            android:contentDescription="@string/qq_login_content_description"
            app:layout_constraintBottom_toBottomOf="parent"
            app:layout_constraintStart_toStartOf="parent"
            app:srcCompat="@drawable/login" />
    
        <ImageButton
            android:id="@+id/wx_login"
            android:layout_width="47dp"
            android:layout_height="47dp"
            android:layout_marginBottom="100dp"
            android:layout_marginEnd="8dp"
            android:layout_marginLeft="8dp"
            android:layout_marginRight="8dp"
            android:layout_marginStart="8dp"
            android:background="@null"
            android:contentDescription="@string/wx_login_content_description"
            app:layout_constraintBottom_toBottomOf="parent"
            app:layout_constraintEnd_toStartOf="@+id/wb_login"
            app:layout_constraintStart_toEndOf="@+id/qq_login"
            app:srcCompat="@drawable/login" />
    
        <ImageButton
            android:id="@+id/wb_login"
            android:layout_width="47dp"
            android:layout_height="47dp"
            android:layout_marginBottom="100dp"
            android:layout_marginEnd="100dp"
            android:layout_marginRight="100dp"
            android:paddingBottom="94dp"
            android:background="@null"
            android:contentDescription="@string/wb_login_content_description"
            app:layout_constraintBottom_toBottomOf="parent"
            app:layout_constraintEnd_toEndOf="parent"
            app:srcCompat="@drawable/login" />

    这里写图片描述

  • 相关阅读:
    Tarjan算法
    10JS数组
    9JS循环
    8.JS流程控制
    7.JS运算符
    6.JS方法
    5.JS变量的各种问题
    java封装遇到的问题
    js报Uncaught SyntaxError: Unexpected token <错误 解决方法:
    使用layui出现Uncaught ReferenceError: layui is not defined问题解决:
  • 原文地址:https://www.cnblogs.com/lvgo/p/13275843.html
Copyright © 2011-2022 走看看