Xin chào các Bạn. Hiện nay trong quá trình thiết kế giao diện ứng dụng cho Android mình thấy có rất nhiều Bạn gặp vấn đề trong việc bo tròn hình ảnh khi hiển thì. Nay mình mạo muội làm hẳn một bài để hướng dẫn các Bạn custom imageview theo kiểu bo tròn bằng XML.
Và thực ra hiện nay mình thấy rất nhiều người hay hỏi làm sao bo tròn ở 4 góc cảu một hình ảnh trong quá trình thiết kế giao diện. Mà thực chất imageview không thể chỉnh sửa 4 góc được, Và cũng có nhiều cách để chính sửa như chỉnh sửa bitmap gốc, ghi đè hoặc cho ảnh gốc vào khung nhưng những cách đó thì luôn có một vấn đề sảy ra đó là "Automagically."
Nhưng sau khi xem bài viết này của mình Bạn có thể bo tròn hình ảnh trong android trực tiếp bằng XML. Nào các bạn hãy cùng thức hiện với mình nhé. Hoặc có thể download soure code ở đây.
1. Đầu tiên bạn hãy tạo một dự án mới Khuyến khích tạo trên Android Sutdio nhé.
2. Trong thư mục / res / drawable các Bạn tạo cho mình một file XML tên tùy ý. Ở đây mình đặt là "custom_image.xml ".
3. Để có được demo thì mình cũng cần phải có 1 file ảnh demo. ở đây các Bạn coppy thẩy nó vào drawable-xhdpi luôn đi cho khỏe nhá. Ở đây mình sử dụng hình này làm demo.
Và thực ra hiện nay mình thấy rất nhiều người hay hỏi làm sao bo tròn ở 4 góc cảu một hình ảnh trong quá trình thiết kế giao diện. Mà thực chất imageview không thể chỉnh sửa 4 góc được, Và cũng có nhiều cách để chính sửa như chỉnh sửa bitmap gốc, ghi đè hoặc cho ảnh gốc vào khung nhưng những cách đó thì luôn có một vấn đề sảy ra đó là "Automagically."
Nhưng sau khi xem bài viết này của mình Bạn có thể bo tròn hình ảnh trong android trực tiếp bằng XML. Nào các bạn hãy cùng thức hiện với mình nhé. Hoặc có thể download soure code ở đây.
1. Đầu tiên bạn hãy tạo một dự án mới Khuyến khích tạo trên Android Sutdio nhé.
2. Trong thư mục / res / drawable các Bạn tạo cho mình một file XML tên tùy ý. Ở đây mình đặt là "custom_image.xml ".
<?xml version="1.0" encoding="utf-8"?><shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle"> <solid android:color="#00ffffff" /> <padding android:left="6dp" android:top="6dp" android:right="6dp" android:bottom="6dp" /> <corners android:radius="12dp" /> <stroke android:width="6dp" android:color="#ffffffff" /> </shape>
3. Để có được demo thì mình cũng cần phải có 1 file ảnh demo. ở đây các Bạn coppy thẩy nó vào drawable-xhdpi luôn đi cho khỏe nhá. Ở đây mình sử dụng hình này làm demo.
4. Tại main_activity.xml mình sẽ có code như sau. Lưu ý, hình ảnh mình đưa vào hình gốc là vuông nha các Bạn.
5. Kết quả



0 comments:
Post a Comment