need a round imagebutton which clips the image in a circle

◇◆丶佛笑我妖孽 提交于 2021-01-07 01:24:50

问题


I need a round image-button which clips the image in a circle, but this is what I get->(see the bus image)->bus image

I have given the description of Imagebutton xml and shape xml. The image is not clipped in a round circle, but it appears that the circle is divided into 2 parts and image is added in the middle. My code is as below->
CODE:

layout/activity.xml:
<ImageButton
                android:id="@+id/imageButtonGenerateBulk"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginRight="25dp"

                android:layout_gravity="center_vertical"
                android:ellipsize="end"
                android:scrollHorizontally="true"
                android:singleLine="true"
                android:text="Generate Qr Code"
                android:textStyle="bold"
                android:layout_alignEnd="@+id/tv_question"
                android:layout_alignRight="@+id/tv_question"
                android:background="@drawable/drawii2"
                android:src="@drawable/bus"
                android:layout_weight="1"/>

drawii2.xml:

    <?xml version ="1.0" encoding ="utf-8"?><!--  Learn More about how to use App Actions: https://developer.android.com/guide/actions/index.html -->
    <shape xmlns:android="http://schemas.android.com/apk/res/android"
        android:shape="rectangle">
    
        <corners
    
            android:radius="40dp" />
    
        <gradient
            android:angle="45"
    
            android:endColor="#01f1fa"
            android:gradientRadius="41dp"
            android:startColor="#0189ff"
            android:type="linear" />
        <!--android:centerX="float"
        android:centerY="float"-->
    
        <!--If your shape requires only one solid color-->
        <!--<solid
            android:color="#FFFFFF" />-->
    
        <size
            android:width="30dp"
            android:height="30dp" />
    
        <!--Use android:dashWidth="2dp" and android:dashGap="2dp"
        to add dashes to your stroke-->
        <stroke
            android:width="2dp"
            android:color="#FFFFFF" />
    
        <!--If you want to add padding-->
        <!-- <padding
             android:left="10dp"
             android:top="20dp"
             android:right="40dp"
             android:bottom="8dp" />-->
    
    </shape>

used this also:

<?xml version ="1.0" encoding ="utf-8"?><!--  Learn More about how to use App Actions: https://developer.android.com/guide/actions/index.html -->
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="oval">
    <solid android:color="#0000" />
    <corners android:radius="20dp" />
    <size
        android:width="10dp"
        android:height="10dp" />
</shape>

回答1:


This code gives me a round button:

<item android:state_enabled="false">
    <layer-list>
        <item android:id="@android:id/background">
            <shape android:shape="oval">
                <solid android:color="@color/colorHint" />
            </shape>
        </item>
    </layer-list>
</item>

<item android:state_pressed="true">
    <layer-list>
        <item android:id="@android:id/background">
            <shape android:shape="oval">
                <solid android:color="@color/colorPrimary" />
            </shape>
        </item>
    </layer-list>
</item>

<item>
    <layer-list>
        <item android:id="@android:id/background">
            <shape android:shape="oval">
                <solid android:color="@color/colorPrimaryLight" />
            </shape>
        </item>
    </layer-list>
</item>

I think you can use it for image view also. This xml file used to handle button states (pressed, enabled...) but you can remove all you don't need. After you set that to your ImageView's background you can try to play with ImageView's android:scaleType to fit your photo the way you want it




回答2:


You can use PorterDuff:

Drawable bt = //Get your picture drawable
            Bitmap results = ((BitmapDrawable)bt).getBitmap();
            Bitmap results32bit = Bitmap.createBitmap(results.getWidth(),  results.getHeight(), Bitmap.Config.ARGB_8888);
            Canvas tmpC = new Canvas(results32bit);
            tmpC.drawBitmap(results,0,0,null);
            Bitmap mutableBitmap = results32bit.copy(Bitmap.Config.ARGB_8888, true);
            Canvas canvas = new Canvas(mutableBitmap);
            Paint paint = new Paint();
            PorterDuff.Mode mode = PorterDuff.Mode.DST_ATOP;// choose a mode
            paint.setXfermode(new PorterDuffXfermode(mode));
            Bitmap bmAppBg = (((BitmapDrawable)(resizeImage(getResources().getDrawable( R.mipmap.round_corner_square_2),results.getWidth(),results.getHeight()))).getBitmap()); 
            paint.setAlpha(255);
            canvas.drawBitmap(bmAppBg, 0, 0, paint);

With your R.mipmap.round_corner_square_2 as a png that's basically circle with transparent inside it and fill on the outside

More info can be found at: https://developer.android.com/reference/android/graphics/PorterDuff.Mode



来源:https://stackoverflow.com/questions/65516669/need-a-round-imagebutton-which-clips-the-image-in-a-circle

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!