屏幕尺寸:
屏幕对角线的长度,单位:英寸(1英寸约等于2.54厘米)
屏幕分辨率:
纵横上面的像素点数,单位px(1px等于一个像素点) 一般以纵向*横向 例如 1920 * 1080
屏幕像素密度:
每英寸上的像素点数,单位dpi,与屏幕尺寸和屏幕分辨率有关
举例:
Nexus 5
屏幕 4.95 inch 1920 * 1080
dpi = 平方根(1920 ^ 2 + 1080 ^ 2) / 4.95 = 445
px:构成图像的最小单位
dp、dip:密度无关像素,以160dpi为准,160dpi = 1px = 1dp(此时)
sp:可以根据文字大小首选项来进行缩放
尽量使用12sp以上,不要使用小数和奇数,以免计算时造成精度的丢失。
像素密度区分:
开发指导网站:http://adchs.github.io/index.html
支持各种屏幕尺寸:
使用wrap_content match_parent weight
weight公式 长度 = 原有长度(layout_width) + 剩余长度 * weight所占比例
使用相对布局,禁用绝对布局
使用限定符
使用尺寸限定符
在layout和layout-large中创建同名布局,android会根据适配在手机和平板(大于七英寸)上选择不同的布局。
最小宽度限定符
屏幕宽度较小的一遍大于600dp时使用该布局(3.2以后平板只需要使用这个布局就可以,3.2以前需要large和最小宽度两个布局文件)
布局别名
使用布局别名之后,只需要维护main_twopanes布局就可以统一平板布局文件
使用方向限定符
-land代表平板横屏时的布局,-port代表平板竖屏时的布局,可以在相应的layouts.xml中声明要使用的布局,方便管理。
综合实例:
假设有一下需求
左边的list是一种单面板的布局,当他横屏的时候就会变成右图,但是如果平板横屏很宽,我们可以使用双面板,也就是左边是list,右边的操作栏是内容的详情。
小屏幕,纵向: 1.单面板
小屏幕,横向: 单面板
7 英寸平板电脑,纵向: 2.单面板,带操作栏
7 英寸平板电脑,横向: 3.双面板,宽,带操作栏
10 英寸平板电脑,纵向: 4.双面板,窄,带操作栏
10 英寸平板电脑,横向: 双面板,宽,带操作栏
电视,横向: 双面板,宽,带操作栏
单面板意味着我们平时使用的手机设备,无论是横向还是竖向都是用单面板的布局文件,如果是7英寸的小平板的话,竖向可以添加一个操作栏,而横向可以使用双面板布局,如果是10英寸的平板,竖向也可以使用双面板,只不过左边的List布局可以窄一点,横向使用宽的。电视同样使用双面板。
综上,我们就需要完成四种布局文件,单面板、单面板带操作栏、双面板窄带操作、双面板宽。
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>
单面板只有一个fragment
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>
双面板窄和宽的区别在于左边fragment的宽度大小。
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>
layouts.xml是默认布局
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>
以上就是使用布局别名还区分布局,这里统一使用了name main_layout 由系统自动区分不同的屏幕,选择恰当的布局,在处理点击事件的时候,可以利用设定的has_two_panes来确定是否使用了双布局。
如果想要在activity中调用布局,并且获取判断是否为双面的值。
setContentView(R.layout.main_layout);
Boolean flag = getResources().getBoolean(R.bool.has_two_pan);