基於DataBinding,實現Android所有尺寸屏幕的精準適配

fit-screen

使用DataBinding的@BindingAdapter功能實現屏幕精準適配,適用於任何分辨率的手機

目錄

原理 (必看!必看!必看)

本庫原理與鴻洋大神的AutoLayout一致,根據UI給出的設計稿的尺寸,將設計稿的尺寸與我們實際的手機的寬高尺寸進行處理換算,獲取換算比例ratio,例如設計稿尺寸爲320x480,我們手機的寬高尺寸爲1080x1920,則獲取換算比例widthRatio=(1080/320)heightRatio=(1920/480)。我們在xml中填寫尺寸時,單位都爲px,直接填寫設計稿中的px尺寸值,在程序編譯時,會將寬度 x widthRatio,高度 x heightRatio,以此將我們繪製的view等比縮放,適配屏幕,做到幾乎和設計圖完全一致,不必再寫xml時自己計算。

優勢

  • 基於@BindingAdapter實現,簡單易懂,非常容易擴展,小白也可立馬上手
  • 與鴻洋大神的AutoLayout相比,我們只需要一次入門,即可終生使用,在任何環境,任何佈局中都可以使用,鴻洋大神的AutoLayout只是定義了一些基本常用的view,遇到自定義view以及google的最新控件時,則需要自己重新按照鴻洋大神的規則,爲需要適配的view重寫,不是很方便。
  • 本庫只有少數幾個文件,非常輕便!

注意點(必看!必看!必看)

在ListView、GridView、RecyclerView的item中使用時,不要在item佈局的最外層使用本庫,可以嵌套一層使用,因爲ListView、GridView的item的容器是ListView與GridView,他們LayoutParams不是ViewGroup.LayoutParams而是ListView.LayoutParams與GridView.LayoutParams,本庫中併爲對這兩種LayoutParams進行處理,當然你可以根據需要,在AdaptiveAtrr文件種對其進行處理(雖然我認爲沒有這個必要)

屬性詳解

看過原理後,我們可知,在我們的適配種,“寬度方向的1px” 與 “高度方向的1px” 是不一樣大小的,所以在適配時,可以選擇以寬度或者高度作爲參考標準

參考標準 描述
width 以屏幕寬度作爲參考標準,ratio=widthRatio
height 以屏幕高度作爲參考標準,ratio=heightRatio
max 以 Math.max( 寬,高 ) 作爲參考標準,ratio=Math.max(widthRatio,heightRatio)
min 以 Math.min( 寬,高 ) 作爲參考標準,ratio=Math.min(widthRatio,heightRatio)
default 默認原始尺寸,不做改變,ratio=1
屬性 描述
fit_base_width view 的寬度參考標準
fit_base_height view 的高度參考標準
fit_layout_minWidth view 最小寬度
fit_base_minWidth view 的寬度參考標準
fit_layout_minHeight view 最小高度
fit_base_minHeight view 最小高度的參考標準
fit_base_margin view 外邊距參考標準(優先級低於單獨設置外邊距)
fit_base_marginLeft view 左外邊距參考標準
fit_base_marginTop view 上外邊距參考標準
fit_base_marginRight view 右外邊距參考標準
fit_base_marginBottom view 下外邊距參考標準
fit_base_padding view 內邊距參考標準
fit_base_paddingLeft view 左內邊距參考標準
fit_base_paddingTop view 上內邊距參考標準
fit_base_paddingRight view 右內邊距參考標準
fit_base_paddingBottom view 下內邊距參考標準
fit_base_textSize textView 字體大小的參考標準
fit_text_maxWidth textView 最大寬度
fit_base_textMaxWidth textView 最大寬度的參考標準
fit_text_maxHeight textView 最大高度
fit_base_textMaxHeight textView 最大高度的參考標準
fit_grid_hspace gridView 的 Item 之間的橫向間距
fit_base_gridHspace gridView 的 Item 之間橫向間距的參考標準
fit_grid_vspace gridView 的 Item 之間的縱向間距
fit_base_gridVspace gridView 的 Item 之間的縱向間距的參考標準
fit_grid_columnWidth gridView 的列寬
fit_base_columnWidth gridView 列寬的參考標準

注意:

  • fit_layout_minWidth、fit_layout_minHeight、fit_text_maxWidth、fit_text_maxHeight、fit_grid_hspace、fit_grid_vspace、fit_grid_columnWidth這幾個屬性,在sdk>=16時,可以使用他們的原生屬性即android:minWidth=”“、android:maxHeight=”“…,如果設置了這些自定義屬性,則以自定義屬性爲準;當sdk<16時,使用自定義屬性

使用方法

  1. 在Application中(或者Activity中)創建設計稿
  FitScreen .createDesign(context, height, width);
  1. 對於要適配的屬性,在xml種添加參考標準(注:所有要適配的屬性,使用px作爲單位,直接抄下設計稿上的px尺寸即可)
    例:
 <TextView
      android:layout_width="200px"
      android:layout_height="200px"
      android:layout_gravity="center_horizontal"
      android:background="#365"
      android:gravity="center"
      android:text="200px"
      android:textColor="#ffffff"
      android:textSize="20sp"
      app:fit_base_height='@{"height"}'
      app:fit_base_textSize='@{"width"}'
      app:fit_base_width='@{"width"}' />

  在上述TextView中,需要適配TextView的高度、寬度以及字體大小,所以在TextView添加自定義屬性  
      app:fit_base_height='@{"height"}'  ===> 以屏高作爲參考標準
      app:fit_base_width='@{"width"}'    ===> 以屏寬作爲參考標準
      app:fit_base_textSize='@{"width"}' ===> 以屏寬作爲參考標準

預覽問題

選擇與創建的設計稿尺寸一致或者相近的模擬器預覽即可(因爲有的公司給的是IOS設計稿,沒有安卓版,只能選相近的,這種情況下預覽會有些偏差,不必在意,真實顯示絕對與設計稿一致)

github傳送門

https://github.com/albert-lii/EasyBinding/tree/master/fit-screen

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章