Cách tạo ImageView bo góc (rounded corners) trong Android

Giới thiệu

Ví dụ này minh họa cách tạo hiệu ứng bo tròn góc cho ImageView bằng cách vẽ bitmap lên Canvas với BitmapShader và drawRoundRect.

Các bước thực hiện

Bước 1: Tạo dự án mới

Mở Android Studio, chọn File → New Project và điền thông tin cần thiết.

Bước 2: Layout (activity_main.xml)

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="https://schemas.android.com/apk/res/android"
    xmlns:app="https://schemas.android.com/apk/res-auto"
    xmlns:tools="https://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    tools:context=".MainActivity">
    <TextView
        android:id="@+id/textView"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="" />
    <ImageView
        android:id="@+id/imageView"
        android:layout_width="fill_parent"
        android:layout_margin="10dp"
        android:layout_height="fill_parent" />
</LinearLayout>

Bước 3: Code bo góc bitmap (MainActivity.java)

package com.example.sample;
import android.graphics.Bitmap;
import android.graphics.BitmapShader;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Paint;
import android.graphics.RectF;
import android.graphics.Shader;
import android.graphics.drawable.BitmapDrawable;
import android.os.Bundle;
import android.support.v7.app.AppCompatActivity;
import android.widget.ImageView;
import android.widget.TextView;

public class MainActivity extends AppCompatActivity {
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        
        TextView textView = findViewById(R.id.textView);
        textView.setTextColor(Color.RED);
        textView.setTextSize(20);
        
        ImageView mImageView = findViewById(R.id.imageView);
        Bitmap mBitmap = ((BitmapDrawable) getResources().getDrawable(R.drawable.cat)).getBitmap();
        
        Bitmap imageRounded = Bitmap.createBitmap(mBitmap.getWidth(), mBitmap.getHeight(), mBitmap.getConfig());
        Canvas canvas = new Canvas(imageRounded);
        Paint mPaint = new Paint();
        mPaint.setAntiAlias(true);
        mPaint.setShader(new BitmapShader(mBitmap, Shader.TileMode.CLAMP, Shader.TileMode.CLAMP));
        
        // Bo góc 100px cho 4 góc
        canvas.drawRoundRect(new RectF(0, 0, mBitmap.getWidth(), mBitmap.getHeight()), 100, 100, mPaint);
        mImageView.setImageBitmap(imageRounded);
    }
}

Bước 4: Manifest (AndroidManifest.xml)

<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="https://schemas.android.com/apk/res/android" package="com.example.sample">
    <application
        android:allowBackup="true"
        android:icon="@mipmap/ic_launcher"
        android:label="@string/app_name"
        android:roundIcon="@mipmap/ic_launcher_round"
        android:supportsRtl="true"
        android:theme="@style/AppTheme">
        <activity android:name=".MainActivity">
            <intent-filter>
                <action android:name="android.intent.action.MAIN" />
                <category android:name="android.intent.category.LAUNCHER" />
            </intent-filter>
        </activity>
    </application>
</manifest>

Chạy ứng dụng

Đặt ảnh cat.png vào res/drawable/. Kết nối thiết bị, nhấn Run.

Cách hiện đại tốt hơn:

• Dùng MaterialShapeDrawable hoặc ShapeableImageView (Material Components)
• XML: app:shapeAppearanceOverlay="@style/RoundedCorners" với cornerFamily="rounded" và cornerSize="16dp"
• Hoặc thư viện Glide/Picasso với transformation RoundedCornersTransformation