美文网首页安卓开发
安卓利用selector设置图片点击效果

安卓利用selector设置图片点击效果

作者: 蓝不蓝编程 | 来源:发表于2020-09-02 11:31 被阅读0次

    目标

    按压后,图片控件显示不同的图片,松开后,又还原.

    效果图

    按压前后效果对比:


    主要代码

    1. 按压后的图片: switch_selected.xml
    <vector xmlns:android="http://schemas.android.com/apk/res/android"
        android:width="64dp"
        android:height="64dp"
        android:viewportWidth="1024"
        android:viewportHeight="1024">
        <path
            android:fillColor="#FF8C00"
            android:pathData="M512.1,960C271.5,960 76.5,765 76.5,524.5c0,-178.1 107,-331.2 260.3,-398.7l0.7,1.3c2.1,-0.5 4.3,-0.7 6.6,-0.7 17.2,0 31.1,14 31.1,31.1 0,7.6 -2.9,14.4 -7.4,19.9l1.4,2.3c-2.5,1 -5,2.3 -7.4,3.4 -2.8,2 -5.9,3.4 -9.2,4.3 -126.3,59.8 -213.7,188.3 -213.7,337.3C138.8,730.8 306,898 512.2,898s373.1,-167.4 373.1,-373.5c0,-139.9 -77.1,-261.5 -190.8,-325.4 -12,-4.3 -20.7,-15.7 -20.7,-29.2 0,-17.2 14,-31.1 31.1,-31.1 5.8,0 11.1,1.7 15.7,4.4l0.5,-0.8c134.9,74 226.4,217.2 226.4,382.1C947.6,765 752.6,960 512.1,960zM711.1,275.5c0,6.8 5.5,12.5 12.5,12.5 6.9,0 12.5,-5.5 12.5,-12.5s-5.5,-12.5 -12.5,-12.5 -12.5,5.7 -12.5,12.5zM512.1,835.6C340.3,835.6 201,696.3 201,524.5c0,-21.1 2.2,-41.7 6.1,-61.7l-22.9,-12.1c-5.3,23.8 -8.2,48.4 -8.2,73.7 0,185.5 150.4,335.9 335.9,335.9s335.9,-150.4 335.9,-335.9c0,-85.5 -32,-163.5 -84.6,-222.7l-15.7,20.1c46.9,54.4 75.3,125.1 75.3,202.6 0.2,171.9 -139,311.2 -310.7,311.2zM530.7,623.9c17.2,0 31.1,-14 31.1,-31.1L561.8,95.1c0,-17.2 -14,-31.1 -31.1,-31.1h-12.5c-17.2,0 -31.1,14 -31.1,31.1v497.8c0,17.2 14,31.1 31.1,31.1l12.5,-0.1z" />
    </vector>
    
    1. 按压前图片: switch_unselected.xml
    <vector xmlns:android="http://schemas.android.com/apk/res/android"
        android:width="64dp"
        android:height="64dp"
        android:viewportWidth="1024"
        android:viewportHeight="1024">
        <path
            android:fillColor="#DCDCDC"
            android:pathData="M512.1,960C271.5,960 76.5,765 76.5,524.5c0,-178.1 107,-331.2 260.3,-398.7l0.7,1.3c2.1,-0.5 4.3,-0.7 6.6,-0.7 17.2,0 31.1,14 31.1,31.1 0,7.6 -2.9,14.4 -7.4,19.9l1.4,2.3c-2.5,1 -5,2.3 -7.4,3.4 -2.8,2 -5.9,3.4 -9.2,4.3 -126.3,59.8 -213.7,188.3 -213.7,337.3C138.8,730.8 306,898 512.2,898s373.1,-167.4 373.1,-373.5c0,-139.9 -77.1,-261.5 -190.8,-325.4 -12,-4.3 -20.7,-15.7 -20.7,-29.2 0,-17.2 14,-31.1 31.1,-31.1 5.8,0 11.1,1.7 15.7,4.4l0.5,-0.8c134.9,74 226.4,217.2 226.4,382.1C947.6,765 752.6,960 512.1,960zM711.1,275.5c0,6.8 5.5,12.5 12.5,12.5 6.9,0 12.5,-5.5 12.5,-12.5s-5.5,-12.5 -12.5,-12.5 -12.5,5.7 -12.5,12.5zM512.1,835.6C340.3,835.6 201,696.3 201,524.5c0,-21.1 2.2,-41.7 6.1,-61.7l-22.9,-12.1c-5.3,23.8 -8.2,48.4 -8.2,73.7 0,185.5 150.4,335.9 335.9,335.9s335.9,-150.4 335.9,-335.9c0,-85.5 -32,-163.5 -84.6,-222.7l-15.7,20.1c46.9,54.4 75.3,125.1 75.3,202.6 0.2,171.9 -139,311.2 -310.7,311.2zM530.7,623.9c17.2,0 31.1,-14 31.1,-31.1L561.8,95.1c0,-17.2 -14,-31.1 -31.1,-31.1h-12.5c-17.2,0 -31.1,14 -31.1,31.1v497.8c0,17.2 14,31.1 31.1,31.1l12.5,-0.1z" />
    </vector>
    
    1. 设置选择器: selector_image_view.xml
    <?xml version="1.0" encoding="utf-8"?>
    <selector xmlns:android="http://schemas.android.com/apk/res/android">
        <item android:drawable="@drawable/switch_selected" android:state_pressed="true" />
        <item android:drawable="@drawable/switch_unselected" android:state_pressed="false" />
    </selector>
    
    1. 使用
    <ImageView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:background="@drawable/selector_image_view"
        android:clickable="true"
        android:focusable="true" />
    

    完整源代码

    https://gitee.com/cxyzy1/selector-demo

    相关文章

      网友评论

        本文标题:安卓利用selector设置图片点击效果

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