Cách tạo Circle ImageView android sử dụng thư viện hdodenhof

0
325
how to create circle imageview in android

Bài viết chia sẻ cho bạn đọc cách tạo Circle ImageView Android sử dụng thư viện hdodenhof. Cách tạo view ảnh bo góc hình tròn trong lập trình Android. Cùng tìm hiểu phía dưới nhé!

1. Circle ImageView Android là gì?

Circle ImageView là một view hình ảnh tròn trong lập trình Android. Thông thường, thẻ Image view của bạn sẽ là hình trữ nhật hoặc hình vuông không bo góc. Trong một số trường hợp, bạn lại muốn view hình ảnh của bạn thành hình tròn tương tự như avatar facebook, zalo . . . và đây chính là thứ sẽ giúp bạn thực hiện điều này.

Circle ImageView sử dụng thư viện do lập trình viên người Đức Henning Dodenhof xây dựng từ năm 2014. Thư viện do lập trình viên này tạo lấy tên là hdodenhof và được cộng đồng lập trình viên android trên toàn thế giới sử dụng. Bạn có thể tìm hiểu chi tiết hơn về thư viện này trên github tại đây.

Thư viện này giúp bạn hạn chế được nhược điểm và thiếu sót của Android SDK. Nó giúp bạn tạo một view ảnh tròn tuyệt đẹp và tùy biến theo ý thích. Bản chất của nó khi sử dụng sẽ giống với việc bạn dùng một thẻ khi thiết kế file XML. Cùng xem phần dưới của bài viết để biết cách thêm thư viện và sử dụng nó nhé!

Ví dụ image circle view
Minh họa Circle ImageView

2. Cách tạo Circle ImageView

Đầu tiên, để sử dụng bạn cần khai báo thư viện hdodenhof trong build.gradle trước.

Cách làm như sau:

Bạn mở file build.gradle(module:app) trong thư mục Gradle Scripts. Sau đó thêm dòng code bên dưới như hình.

import hdodenhof to build gradle

Gradle code:

dependencies {
    . . . 
    compile 'de.hdodenhof:circleimageview:2.1.0'    // Thêm dòng này
}

Đây cũng là cách import thư viện cho layout, nếu cần sử dụng thư viện ngoài cho thiết kế giao diện, bạn cứ sử dụng theo cách này nhé!

Sau khi code thêm dòng code bên trên vào file Build.gradle xong, bây giờ bạn có thể sử dụng tạo một Circle ImageView như một thẻ thông thường:

Thẻ: <de.hdodenhof.circleimageview.CircleImageView>

Ví dụ sử dụng trong file layout:

<de.hdodenhof.circleimageview.CircleImageView
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:id="@+id/profile_image"
    android:layout_width="96dp"
    android:layout_height="96dp"
    android:src="@drawable/ic_launcher_background"
    app:civ_border_width="2dp"
    app:civ_border_color="#FF000000"/>

Lưu ý là bạn có thể tủy chỉnh kích thước tùy ý, chỉ cần giữ chiều rộng và chiều cao ( width và height) bằng nhau là được nhé!

Cảm ơn bạn đã quan tâm bài viết xem thêm các bài viết khác về lập trình của mình tại đây nha.
Chúc bạn thành công!

LEAVE A REPLY

Please enter your comment!
Please enter your name here