[Android] Databinding set FontStyle XML

I.Giới thiệu Chắc hẳn bạn đã từng thiết kế giao diện cần sử dụng đến các file font style do khách hàng hay bên thiết kế yêu cầu. Để dùng được font style đó bạn phải code 1 đống các hàm khởi tạo font rồi đi tìm từng biến textview, buttom, edittext... cần dùng font style để set vừa mất thời gian vừa thừa thãi code, nếu gặp giao diện có 20>30 textview mà lại dùng đến vài bộ font style khác nhau thì thôi rồi. Nhiều bạn có cách xử lý tốt hơn bằng cách gộp các View cần dùng theo loại font style để xử lý, điều này sẽ giảm thời gian và hạn chế code nhưng không linh hoạt khi phải thực thi các yêu cầu thay đổi font từ phía khách hàng. Bạn có cảm thấy việc sử dụng các font style bên ngoài này phức tạp không. Mình sẽ hướng dẫn các bạn thực thi việc set font style đơn giản như việc bạn thay đổi color hay background của view vậy. Mình bắt đầu nhé.

II.Cách thực hiện

1. Sử dụng Databinding

   • Dùng để set font style trong file thiết kế giao diện XML
   • Trong file gradle thêm đúng dòng code sau để databinding được kích hoạt

    dataBinding {
       enabled = true
   }
   

2. Font style

   • Đặt các loại font cần dùng vào 1 thư mục nào đó trong forder asset (ở đây mình đặt trong fonts/)

     private static final String PATH_FONT = "fonts/";
   

3. Thực thi code (tạo FontUtils)

   • Khởi tạo các fontstyle, định nghĩa tên sử dụng bằng 1 biến enum (mình đang dùng 4 loại font roboto)

     public enum FontStyle {
           ROBOTO_BOLD("Roboto-Bold.ttf"),
           ROBOTO_ITALIC("Roboto-Italic.ttf"),
           ROBOTO_MEDIUM("Roboto-Medium.ttf"),
           ROBOTO_REGULAR("Roboto-Regular.ttf")
           private String name;
           FontStyle(String name) {
               this.name = name;
           }
           @Override
           public String toString() {
               return name;
           }
      }
   

   • Hàm Get > lấy font trong asset

      private static Hashtable<String, Typeface> fontCache = new Hashtable<String, Typeface>();
      public static Typeface getTypeface(String name) {
       Typeface typeface = fontCache.get(name);
       if (typeface == null) {
           try {
               typeface = Typeface.createFromAsset(App.getInstance().getAssets(), PATH_FONT + name);
           } catch (NullPointerException e) {
               Log.e("FontUtil", "Font's not found " + name + "");
               return null;
           }
           fontCache.put(name, typeface);
       }
       return typeface;
    }
   

   • Hàm Set > set font cho View (mình đang set font cho textview, edittext, button có thể viết thêm các loại view ở đây)
   • Với _@BindingAdapter("font") dùng để định nghĩa tên sử dụng trong XML

       _@BindingAdapter("font")
      public static void setFont(View view, FontStyle fontStyle) {
          if (view instanceof TextView) {
              ((TextView) view).setTypeface(FontUtils.getTypeface(fontStyle.toString()));
          } else if (view instanceof EditText) {
              ((EditText) view).setTypeface(FontUtils.getTypeface(fontStyle.toString()));
          } else if (view instanceof Button) {
              ((Button) view).setTypeface(FontUtils.getTypeface(fontStyle.toString()));
          }
      }
   

4. Cách sử dụng

   • Import vào XML rồi dùng như 1 thuộc tính mặc định của hệ thống

       <data>
       <import type="com.buitiendat.FontUtils.FontStyle"></import>
       </data>
   

   • Set cho từng TextView rất đơn giản như các thuộc tính mà SDK hỗ trợ vậy (mình đang dùng font Roboto-Bold.ttf)

   <TextView
           android:layout_awidth="@dimen/dp50"
           android:layout_height="@dimen/dp50"
           app:font="@{FontStyle.ROBOTO_BOLD}" />
   

IV.Kết Thúc

• Kết quả sử dụng
  • Tối ưu code
  • Dễ dàng sử dụng, linh hoạt thay đổi
  • Demo: https://github.com/oBuiTienDat/fontstyle
  • Xin cảm ơn các bạn đã đọc.