多应用+插件架构,代码干净,二开方便,首家独创一键云编译技术,文档视频完善,免费商用码云13.8K 广告
**一、重要概念** 屏幕尺寸:指平米的对角线的长度,单位是英寸,1英寸=2.54厘米,它对我们屏幕适配不是很重要。 屏幕分辨率:指在横纵向上的像素点数,单位是px,1px = 1个像素点,一般以纵向像素*横向像素,如1920*1080. 屏幕像素密度:指每英寸上的像素点数,单位是dpi,即“dot per inch”的缩写,像素密度与屏幕尺寸和分辨率有关 像素密度计算:对角线分辨率-->对角线分辨率除以屏幕尺寸-->像素密度 例:Nexus 5 屏幕尺寸是4.95,分辨率是1920*1080,则dpi=(√(1920*1920+1080*1080))/4.94=445 px:构成图像的最小单位 使用android原生api返回的都是这个单位,如获取安卓屏幕的宽和高<br> dp、dip:Density Independent Pixels的缩写,即密度无关像素,以160dpi(像素密度)为基准,1dip = 1px sp:Scale-Independent Pixels 可以根据文字大小首选项进行缩放 谷歌开发官方推荐使用12sp或以上大小单位,否则可能用户看不清楚 首选字体大小为12sp,14sp,18sp,22sp。不要使用基数小数,以免造成精度丢失 安卓屏幕密度划分:mdpi、hdpi、xdpi、xxdpi 设计文档:[http://www.apkbus.com/design/style/iconography.html](http://www.apkbus.com/design/style/iconography.html) 在设计图标时,对于五种主流的像素密度(MDPI、HDPI、XHDPI、XXHDPI 和 XXXHDPI)应按照 2:3:4:6:8 的比例进行缩放。例如,一个启动图标的尺寸为48x48 dp,这表示在 MDPI 的屏幕上其实际尺寸应为 48x48 px,在 HDPI 的屏幕上其实际大小是 MDPI 的 1.5 倍 (72x72 px),在 XDPI 的屏幕上其实际大小是 MDPI 的 2 倍 (96x96 px),依此类推。 **二、解决方案,支持各种屏幕尺寸** 1、wrap_content(包住内容) match_content匹配父容器的大小,weight:权重,同时用了wrap_content 权重大的先学会拉伸。 layout_weight只能在线程布局里使用 计算的宽度= 原来宽度 + 剩余空间所占百分比的宽度 假设屏幕宽度为L Button1 2/3L = L + (L - 2L)* 1/3 = 2/3L 用0dp 1/3L = 0 + L *1/3 Button2 1/3L = L + (L- 2L)*2/3 = 1/3L 2、使用large限定符 ~~~ res/layout/main.xml 单面板 <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:orientation="vertical" android:layout_width="match_parent" android:layout_height="match_parent"> <fragment android:id="@+id/headlines" android:layout_height="fill_parent" android:name="com.example.android.newsreader.HeadlinesFragment" android:layout_width="match_parent" /> </LinearLayout> res/layout-large/main.xml 双面板 <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="fill_parent" android:layout_height="fill_parent" android:orientation="horizontal"> <fragment android:id="@+id/headlines" android:layout_height="fill_parent" android:name="com.example.android.newsreader.HeadlinesFragment" android:layout_width="400dp" android:layout_marginRight="10dp"/> <fragment android:id="@+id/article" android:layout_height="fill_parent" android:name="com.example.android.newsreader.ArticleFragment" android:layout_width="fill_parent" /> </LinearLayout> ~~~ 3、布局别名 ~~~ 使用布局别名 res/layout/main.xml: 单面板布局 res/layout-large/main.xml: 多面板布局 res/layout-sw600dp/main.xml: 多面板布局 res/layout/main.xml 单面板布局 res/layout/main_twopanes.xml 双面板布局 setContentView(R.layout.main); 默认布局 res/values/layout.xml: <resources> <item name="main" type="layout">@layout/main</item> </resources> Android3.2之前的平板布局 res/values-large/layout.xml: <resources> <item name="main" type="layout">@layout/main_twopanes</item> </resources> Android3.2之后的平板布局 res/values-sw600dp/layout.xml: <resources> <item name="main" type="layout">@layout/main_twopanes</item> </resources> ~~~ 4、屏幕宽度限定符 ~~~ res/layout/main.xml,单面板(默认)布局: <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:orientation="vertical" android:layout_width="match_parent" android:layout_height="match_parent"> <fragment android:id="@+id/headlines" android:layout_height="fill_parent" android:name="com.example.android.newsreader.HeadlinesFragment" android:layout_width="match_parent" /> </LinearLayout> res/layout-sw600dp/main.xml,双面板布局: Small Width 最小宽度 <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="fill_parent" android:layout_height="fill_parent" android:orientation="horizontal"> <fragment android:id="@+id/headlines" android:layout_height="fill_parent" android:name="com.example.android.newsreader.HeadlinesFragment" android:layout_width="400dp" android:layout_marginRight="10dp"/> <fragment android:id="@+id/article" android:layout_height="fill_parent" android:name="com.example.android.newsreader.ArticleFragment" android:layout_width="fill_parent" /> </LinearLayout> ~~~ 5、屏幕方向限定符 ~~~ 使用屏幕方向限定符 res/values-sw600dp-land/layouts.xml: <resources> <item name="main" type="layout">@layout/main_twopanes</item> </resources> res/values-sw600dp-port/layouts.xml: <resources> <item name="main" type="layout">@layout/main</item> </resources> 小屏幕,纵向: 1.单面板 小屏幕,横向: 单面板 7 英寸平板电脑,纵向: 2.单面板,带操作栏 7 英寸平板电脑,横向: 3.双面板,宽,带操作栏 10 英寸平板电脑,纵向: 4.双面板,窄,带操作栏 10 英寸平板电脑,横向: 双面板,宽,带操作栏 电视,横向: 双面板,宽,带操作栏 1.res/layout/onepane.xml:(单面板) <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:orientation="vertical" android:layout_width="match_parent" android:layout_height="match_parent"> <fragment android:id="@+id/headlines" android:layout_height="fill_parent" android:name="com.example.android.newsreader.HeadlinesFragment" android:layout_width="match_parent" /> </LinearLayout> 2.res/layout/onepane_with_bar.xml:(单面板带操作栏) <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:orientation="vertical" android:layout_width="match_parent" android:layout_height="match_parent"> <LinearLayout android:layout_width="match_parent" android:id="@+id/linearLayout1" android:gravity="center" android:layout_height="50dp"> <ImageView android:id="@+id/imageView1" android:layout_height="wrap_content" android:layout_width="wrap_content" android:src="@drawable/logo" android:paddingRight="30dp" android:layout_gravity="left" android:layout_weight="0" /> <View android:layout_height="wrap_content" android:id="@+id/view1" android:layout_width="wrap_content" android:layout_weight="1" /> <Button android:id="@+id/categorybutton" android:background="@drawable/button_bg" android:layout_height="match_parent" android:layout_weight="0" android:layout_width="120dp" style="@style/CategoryButtonStyle"/> </LinearLayout> <fragment android:id="@+id/headlines" android:layout_height="fill_parent" android:name="com.example.android.newsreader.HeadlinesFragment" android:layout_width="match_parent" /> </LinearLayout> 3.res/layout/twopanes.xml:(双面板,宽布局) <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="fill_parent" android:layout_height="fill_parent" android:orientation="horizontal"> <fragment android:id="@+id/headlines" android:layout_height="fill_parent" android:name="com.example.android.newsreader.HeadlinesFragment" android:layout_width="400dp" android:layout_marginRight="10dp"/> <fragment android:id="@+id/article" android:layout_height="fill_parent" android:name="com.example.android.newsreader.ArticleFragment" android:layout_width="fill_parent" /> </LinearLayout> 4.res/layout/twopanes_narrow.xml:(双面板,窄布局) <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="fill_parent" android:layout_height="fill_parent" android:orientation="horizontal"> <fragment android:id="@+id/headlines" android:layout_height="fill_parent" android:name="com.example.android.newsreader.HeadlinesFragment" android:layout_width="200dp" android:layout_marginRight="10dp"/> <fragment android:id="@+id/article" android:layout_height="fill_parent" android:name="com.example.android.newsreader.ArticleFragment" android:layout_width="fill_parent" /> </LinearLayout> 1.res/values/layouts.xml: <resources> <item name="main_layout" type="layout">@layout/onepane_with_bar</item> <bool name="has_two_panes">false</bool> </resources> 2.res/values-sw600dp-land/layouts.xml: <resources> <item name="main_layout" type="layout">@layout/twopanes</item> <bool name="has_two_panes">true</bool> </resources> 3.res/values-sw600dp-port/layouts.xml: <resources> <item name="main_layout" type="layout">@layout/onepane</item> <bool name="has_two_panes">false</bool> </resources> 4.res/values-large-land/layouts.xml: <resources> <item name="main_layout" type="layout">@layout/twopanes</item> <bool name="has_two_panes">true</bool> </resources> 5.res/values-large-port/layouts.xml: <resources> <item name="main_layout" type="layout">@layout/twopanes_narrow</item> <bool name="has_two_panes">true</bool> </resources> ~~~ 6、.9图的使用 目录为:sdk->tools->draw9patch.bat 主要是通过在这四条边画一个像素长度的点或线,来控制想要进行拉伸或者添加间隔的操作。 左边和上边的线控制的是拉伸区域(Stretchable area),这两条线的中心交集区域就是要 进行的拉伸区域;而右边和下边的两条线控制的是间隔区域(Padding box),这两条边是可选的,这个区域用来写内容 **三、解决方案,支持各种屏幕密度** 1.使用非密度制约像素 android:layout_alignParentRight="true" 2.提供备用位图 多提供几张图片。使用和目标文件夹相符的文件夹,占用内存小,因为图标放大的时候内存也会增加。 3、代码适配 dp和px的关系: dp = px/设备密度 ~~~ public static int dp2px(Context ctx, float dp) {           float density = ctx.getResources().getDisplayMetrics().density;           int px = (int) (dp * density + 0.5f);// 四舍五入              return px;       }          public static float px2dp(Context ctx, int px) {           float density = ctx.getResources().getDisplayMetrics().density;           float dp = px / density;              return dp;       } ~~~ **四、实施自适应用户界面流自适应** 平板和手机设备:重复使用活动中的片段,用一个标志位,处理屏幕方向变化。