使用DataBinding来进行字体的自定义
ouyangbbbbwwww
8年前
<p>写在前面</p> <p>在Android应用开发中，由于客户或者个人的需要（谁叫Android默认的字体那么丑 ），所以需要配置不同的字体,而 Android 只能在 xml 中配置系统默认提供的四种字体,需要自定义的字体都需要在 Java 代码中配置。</p> <p>总结一下以前自定义字体的方法</p> <p>1 .通过findViewById找到view,然后一个个的去设置字体</p> <pre> Typeface customFont = Typeface.createFromAsset(this.getAssets(), "fonts/customFont.ttf"); TextView view = (TextView) findViewById(R.id.text); view.setTypeface(customFont);</pre> <p> 一个看着还好，可是应用中可是有很多的文本或者按钮的，不可能逐个去设置。于是大多数都选择了第二种方法。</p> <p>2 .创建一个子类，继承自TextView或者Button等等</p> <pre> public class CustomTextView extends TextView { public CustomTextView(Context context, AttributeSet attrs, int defStyle) { super(context, attrs, defStyle); } public CustomTextView(Context context, AttributeSet attrs) { super(context, attrs); } public CustomTextView(Context context) { super(context); } public void setTypeface(Typeface tf, int style) { if (style == Typeface.BOLD) { super.setTypeface(Typeface.createFromAsset(getContext().getAssets(), "fonts/CustomFont_Bold.ttf")); } else { super.setTypeface(Typeface.createFromAsset(getContext().getAssets(), "fonts/CustomFont.ttf")); } } }</pre> <p>然后在xml文件中每次都使用自定义的View，相比上一个方案，这一个要稍微好点。但相信都达不到各位的要求，只不过是换一个字体，需要这么麻烦吗？</p> <p>3 . Calligraphy</p> <p>这是一个开源库，地址是 https://github.com/chrisjenx/Calligraphy ，在github上5000+star,感觉还是不错的，也从侧面说出自定义字体的需求量有多大。</p> <h3><em>那么接下来就讲重点了</em></h3> <p>如何使用DataBinding来进行字体的自定义呢？</p> <p>TOO EASY,不用每次都去手写，也不需要自定义View</p> <p>首先，打开DataBinding</p> <pre> android { compileSdkVersion 25 buildToolsVersion "25.0.0" defaultConfig { } buildTypes { } dataBinding { enabled = true } }</pre> <p>再看结构</p> <p style="text-align: center;"><img src="https://simg.open-open.com/show/54e6faa99b33bce500adb46a6ccb4650.png"></p> <p>在项目中的assets/fonts文件夹下加入了5种字体，然后在 strings.xml 中定义了字体的路径</p> <p>而在layout的xml中只需要这么使用，那么便已经完成了8成了</p> <pre> <?xml version="1.0" encoding="utf-8"?> <layout xmlns:android="http://schemas.android.com/apk/res/android"> <data> </data> <LinearLayout android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="vertical" android:gravity="center"> <TextView android:layout_width="match_parent" android:layout_height="50dp" android:gravity="center" android:text="Hello world" android:textSize="18sp" android:typeface="@{@string/nutso2}"/> <TextView android:layout_width="match_parent" android:layout_height="50dp" android:gravity="center" android:textSize="18sp" android:text="Hello world" android:typeface="@{@string/notoSans_regular}"/> <TextView android:layout_width="match_parent" android:layout_height="50dp" android:gravity="center" android:textSize="18sp" android:text="Hello world" android:typeface="@{@string/notoSansui_boldItalic}"/> <TextView android:layout_width="match_parent" android:layout_height="50dp" android:gravity="center" android:text="Hello world" android:textSize="18sp" android:typeface="@{@string/icomoon}"/> <TextView android:layout_width="match_parent" android:layout_height="50dp" android:gravity="center" android:text="Hello world" android:textSize="18sp" android:typeface="@{@string/ruthie}"/> </LinearLayout> </layout></pre> <p>而剩下的两成，一成在 FontBinding 文件</p> <pre> public class FontBinding { @BindingConversion public static Typeface convertStringToFace(String s){ try { return Typeface.createFromAsset(FontApp.getInstance().getAssets(),s); }catch (Exception e){ throw e; } } }</pre> <p>这里定义了一个转换器，将xml文件中获取到的字符资源，转换成了一个 Typeface</p> <p>最后一成，只需要使用就好了</p> <pre> public class MainActivity extends AppCompatActivity { ActivityMainBinding mMainBinding; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); mMainBinding = DataBindingUtil.setContentView(this, R.layout.activity_main); } }</pre> <p>看一下截图，一起哈啤</p> <p style="text-align: center;"><img src="https://simg.open-open.com/show/bd1e307fc6528c71ca99b0327ecb7915.jpg"></p> <p style="text-align: center;">没了解过DataBinding的人可能不知道 ActivityMainBinding 是怎么来的，这是编译时生成的，在如下图所示的位置可以找到 <img src="https://simg.open-open.com/show/92fba617e8d1256eb214381d176622fc.png"> 打开 ActivityMainBinding 可以看到这样的代码</p> <pre> this.mboundView1.setTypeface(com.ditclear.sample.FontBinding.convertStringToFace(mboundView1.getResources().getString(R.string.nutso2))); this.mboundView2.setTypeface(com.ditclear.sample.FontBinding.convertStringToFace(mboundView2.getResources().getString(R.string.notoSans_regular))); this.mboundView3.setTypeface(com.ditclear.sample.FontBinding.convertStringToFace(mboundView3.getResources().getString(R.string.notoSansui_boldItalic))); this.mboundView4.setTypeface(com.ditclear.sample.FontBinding.convertStringToFace(mboundView4.getResources().getString(R.string.icomoon))); this.mboundView5.setTypeface(com.ditclear.sample.FontBinding.convertStringToFace(mboundView5.getResources().getString(R.string.ruthie)));</pre> <p>这些 mboundViewX 就是xml中的TextView,由于没写id，所以都是自动生成的名称，可以看到给每一个使用了绑定的TextView都设置了字体，相当于系统帮我们做了第一个方法中重复性的工作。</p> <p>当然我们还可以优化一下，由于每次都要操作assests文件夹，也会带来一定的开销，所以也有必要提供一个字体缓存 FontCache </p> <pre> public class FontCache { private static ArrayMap<String, Typeface> fontCache = new ArrayMap<String, Typeface>(); public static Typeface getTypeface(String fontName, Context context) { Typeface tf = fontCache.get(fontName); if(tf == null) { try { tf = Typeface.createFromAsset(context.getAssets(), fontName); } catch (Exception e) { return null; } fontCache.put(fontName, tf); } return tf; } }</pre> <p>那么 FontBinding 就变成了这样</p> <pre> public class FontBinding { @BindingConversion public static Typeface convertStringToFace(String fontName){ try { return FontCache.getTypeface(fontName,FontApp.getInstance()); }catch (Exception e){ throw e; } } }</pre> <p><em>补充：</em> 如果不想每次都在xml中设置字体,可以在绑定一个常用的属性时设置一个默认的字体。比如字体是需要作用在 text 上的，那么我们只需要在 setText 的时候绑定一个默认的字体就了，看代码</p> <pre> public class FontBinding { @BindingAdapter("android:text") public static void setText(TextView v, String s){ v.setTypeface(convertStringToFace(FontApp.getInstance().getString(R.string.ruthie))); v.setText(s); } }</pre> <p>这样在绑定文本的时候就会绑定一个默认的字体，不用每次都写</p> <pre> <?xml version="1.0" encoding="utf-8"?> <layout xmlns:android="http://schemas.android.com/apk/res/android"> <data> </data> <LinearLayout android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="vertical" android:gravity="center"> <TextView android:layout_width="match_parent" android:layout_height="50dp" android:gravity="center" android:text="@{@string/hello_world}" android:textSize="18sp"/> <TextView android:layout_width="match_parent" android:layout_height="50dp" android:gravity="center" android:textSize="18sp" android:text="@{@string/hello_world}" android:typeface="@{@string/notoSans_regular}"/> </LinearLayout> </layout></pre> <p>最后，效果图：</p> <p style="text-align: center;"><img src="https://simg.open-open.com/show/6a877789de230c1968adb89dfbd830cb.jpg"></p> <p>好了，大功告成！这也算是一种新思路吧。 </p> <p> </p> <p>来自：http://www.jcodecraeer.com/a/anzhuokaifa/androidkaifa/2017/0118/7054.html</p> <p> </p>