Android Material Design 之基础知识

最新推荐文章于 2022-12-31 10:50:40 发布

Yolosiro

最新推荐文章于 2022-12-31 10:50:40 发布

阅读量740

点赞数

CC 4.0 BY-SA版权

分类专栏： Android

本文链接：https://blog.youkuaiyun.com/github_28921587/article/details/51620777

Android 专栏收录该内容

6 篇文章

订阅专栏

关于屏幕尺寸和像素

dp, px 和 dpi等
- px 是单词 pixel的缩略，像素是分辨率的尺寸单位。
- resolution 分辨率，指的是屏幕纵，横方向的像素数量，比如一个分辨率为320*240的屏幕。
- dpi 是英语（ dots per inch)的缩略，即每英寸有多少个点，一个点相当于就是一个像素。比如有一个分辨率为320*240的屏幕，该屏幕的尺寸是（2英寸 * 2.5英寸），那么这个块屏幕的dpi就是160dpi。
  dpi的大小不仅和分辨率有关还和屏幕物理尺寸有关。
- 屏幕尺寸，通常我们说屏幕的物理大小都不是说屏幕的长宽多少寸，而是用屏幕对角线的物理尺寸来代替。
  比如一块长3英寸，宽4英寸的屏幕，我们知道它的对角线长势5英寸，通常就说这块屏幕是5英寸的屏幕。
  在看看我们dpi的定义，我们就不难得出dpi是如何计算来的了，我们就有一块分辨率为320*240的2.5英寸的屏幕，其对角线的像素数量是：
  $\sqrt {(320^2 +240^2)} =400$
  所以我们的dpi约为： $\frac{400}{2.5} = 160$
- density 屏幕密度： $density = \frac{分辨率}{屏幕尺寸}$
- dp(dip)是英语（Density-independent pixel)的缩略，即与密度无关的像素，这是android 定义的一种虚拟的尺寸单位，方便我们各种不同尺寸的屏幕对UI进行布局。
  那么dp对应多少像素呢？看公式：
  $\frac{px}{dp}=\frac{dpi}{160}$
  比如，我们有一块320*240的2.5英寸的屏幕，有上例可知该屏幕的dpi为160，所以我们知道： $1dp=\frac{160}{160}px$
  在设计的时候，利用dp可以很好的解决android 设备碎片化的问题，而且我们应当优先设计适用于小屏幕的尺寸和布局。
- sp 是英语（Scale-independent pixel)的缩写，缩放独立像素，主要用于字体大小的尺寸，Android 允许用户自定义其字体的大小，在“设置”–“辅助功能”中，我们可以找到这项字体大小的设置，那么这个设置会对字体的显示进行改变，通常normal (100%)字体大小，我们app设置的16sp大小的字体就和16dp大小的字体一样大，但若设置为大好字体，即125%后，16sp = 16dp * 125% = 20dp。当然如果我们不想我们设置的字体大小会随着这个设计进行改变，那么我们可以直接将字体的大小设置为其他的单位，如dp，px甚至mm。

android 设计时常用的资源文件夹与对应的dpi和dp关系如下：

资源文件夹	dpi	px
LDPI	120dpi	.75x
MDPI	160dpi	1x
HDPI	240dpi	1.75x
XHDPI	320dpi	2x
XXHDPI	480dpi	3x
XXXHDPI	640dpi	4x

并不是所有屏幕的dpi都是在上列表中的一项，实际中会匹配最接近的那一项，比如三块屏幕dpi分别为270，311，580，这个时候分别对应的资源文件夹应该为HDPI，XHDPI， XXXHDPI
资源文件夹规则
我们的android 资源文件夹，我们应主要关注 MDPI,HDPI,XHDPI,XXDPI
这几个文件夹有上表可知分别对应1x，1.75x, 2x, 3x
系统在会根据实际的dpi先寻找到最接近的图片资源文件，在其中去寻找，如果没有的话就会向下继续寻找。但这个寻找的过程实际上多多少少会影响性能，特别是在运行时。
所以我们最好在这四个文件夹里面都存放相应的资源icon。
这里介绍一个在线对资源icon进行处理的工具：Android Asset Studio

关于资源文件夹以及限定符

Android 工程资源文件夹目录结构如下所示：
- –app
  - –res
    - –anim
    - –animator
    - –drawable
    - –raw
    - –color
    - –layout
    - –menu
    - –drawable-ldpi(mdpi\hdpi\xhdpi\xxhdpi\xxxhdpi
    - –mipmap-hdpi(mdpi\xhdpi\xxhdpi\xxxhdpi)
    - –xml
    - –values
  - –assets
各资源目录所存储的文件如下表所示：

目录	资源类型
anim	存储Tween 动画的XML文件，即渐变动画或者叫做补间动画.
animator	存储属性动画的XML文件，属性动画也可以存在anim目录中，但为了区分这两种动画，属性动画首选animator目录
drawable	存放一些能编译为位图文件，九宫(可调整大小的位图)，状态列表，形状，动画drawable等其他可编译的drawable的XML文件
raw	原生数据文件，以原始值就行保存的问，这些文件的访问需要用inputstream来打开这些资源，使用其资源ID(即R.raw.filename)调用Resources.openRawResource(R.raw.filename)
color	存放用户定义颜色状态列表的XML文件
layout	存放各种布局的XML文件
menu	存放toolbar等应用的菜单（如选项，上下文或者子菜单）的XML文件。
drawable-hdpi(…)	存放用于不同屏幕密度的位图文件（.png, .9.png, .jpg, .gif)
mipmap-hdpi(…)	存放用于不同启动器图标密度Drawable文件
xml	一些可以在运行时通过Resources.getXML()读取的任意XML文件，也包括各种配置文件，以及一些原生数据的声明的XML的文件，比如account-authenticator, pref-general, widget-info 等的声明文件。
values	存放各种颜色，文字，尺寸，样式，简单数组，整型数等。
assets	存储可以访问原始文件名和文件层次结构的文件，这些文件没有资源ID，因此需要使用AssetManager来读取这些文件

3. 资源限定符介绍：

几乎每个应用都应该提供备用资源以支持特定的设备配置。比如我们的布局，应提供仅适用于tablet的布局，或者提供手机landscape视图的布局资源；这对于解决Android 屏幕碎片化等问题有很大帮助；另外是在关于某些特定api才能使用的功能的资源的使用，比如material design定义的一些过场动画，在低于21的设备中是无法应用这些过场动画的，这个时候就需要指定只能在v21下才能使用的资源。

命名形式为< resources_name >-< config_qualifier>
- resources_name 为相应默认资源文件目录名称，如上表定义。
- qualifier 是指定要使用这些资源的各个配置的名称，后面会列在表里。
  - 注意可以追加多个qualifier，并使用断线进行分开。在追加多个限定符时，也必须按照后表中列出的相同顺序放置它们。如果限定符的顺序是错误的，那么这个资源将被忽略。
将相应的资源放到新的目录后，该资源文件的名称必须与默认资源文件完全一样。

资源限定符按优先级顺序排列见下表：

配置	限定符值	描述
MCC和MNC	示例: mcc310 mcc310-mnc004 mcc460-mnc002 等等	移动国家代码（mcc）,后可选跟SIM卡中的移动网络代码（MNC）。例如 mcc460-mnc001指的是中国联通的GSM系统，使用无线电连接，则mcc和mnc的值来自SIM卡。也可以单独使用MCC，只根据指定，则改用”语言和区域”限定符
语言和区域	示例: en fr en-rUS fr-rFR CN	常用的就是在字符串的翻译上，当然也可以将这个资源限定符用于layout ，anim等其他的资源目录中。语言通过两个字母组成的语言代码定义，后跟两个字母组成的区域码，区域码之前带’r’，用r来区分语言和区域，区域码是可选的。这些代码都是不区分大小写的，不能单独制定区域代码。
布局方向	ldrtl ldltr	应用的布局方向，ldrtl是指“布局从右到左”，ldltr是指“布局从左到右”这是默认的值，例如： /res layout/ main.xml (默认的布局文件) layout-ar/ main.xml (针对阿拉伯语的布局文件) layout-ldrtl/ main.xml (针对任何从右到左的语言的布局文件，此处会排除阿拉伯语，因为“ar” 这个语言限定符优先级比布局更高，而此处我们已经指定了阿拉伯语的布局文件)，要使用从右到左的布局功能，必须将supportRtl设置为true，并将 targetSdkVersion设置为17或更高。
smallestWidth	sw< n>dp 示例： sw320dp sw600dp sw720dp 等等	屏幕的基本尺寸，有屏幕的最小尺寸指定。也就是说smallestWidth是屏幕可用高度和宽度的最小尺寸和屏幕的方向并没有关系。使用这个限定符确保应用UI的可用宽度至少 dp。例如：如果布局要求可用屏幕的最小尺寸始终至少为600dp,则可以使用layout-sw600dp这个资源限定符。这样仅当可用屏幕的最小尺寸至少为600dp时，系统才会使用这些资源，而不考虑600dp是代表屏幕的高度还是宽度。以下是一些可用于普通屏幕尺寸的值： . 320,适用于屏幕配置如下的设备：。240x320ldpi（QVGA手机）。320x480mdpi（手机）。480x800hdpi（高密度手机） . 480,适用于480x800mdpi之类的屏幕（平板电脑/手机)。 . 600,适用于600x1024mdpi之类的屏幕（7英寸平板电脑)。 . 720,适用于720x1024mdpi之类的屏幕（10英寸平板电脑)。系统会使用最接近但未超出设备smallestWidth的值。
可用宽度	w< N>dp 示例: w720dp w1024dp	指定资源应该使用的最小可用屏幕宽度，以dp为单位，由< n>值决定，注意在横向和纵向进行切换时，为了匹配当前实际的宽度，此配置也会随之发生变化 (不像smallestWidth那样，当屏幕方向发生变化该值不会变)。
可用高度	h< N>dp 示例： h720dp h1024dp	指定资源应该使用的最小可用屏幕高度，以dp为单位，有< n>值决定，注意在横向和纵向进行切换时，为了匹配当前的实际宽度，此配置也会随之发生变化
屏幕尺寸	small normal large xlarge	small: 尺寸类似于低密度QVGA屏幕的屏幕。小屏幕的最小屏幕尺寸约为320x427dp。例如，QVGA低密度屏幕和VGA高密度屏幕 normal: 尺寸类似于中等密度的HVGA屏幕的屏幕。标准屏幕的最小布局尺寸约为320x476dp。例如：WQVGA低密度屏幕，HVGA中等密度屏幕，WVGA高等密度屏幕。 large: 尺寸类似于中等密度的VGA屏幕，大屏幕的最小布局尺寸约为480x640dp, 例如VGA和WVGA中等密度屏幕 xlarge: 明显大于传统中等密度HVGA屏幕的屏幕，超大屏幕的最小布局尺寸约为 720x960dp.在大多数情况下，屏幕超大的设备体积过大，不能放进口袋，最常见的是平板设备
屏幕纵横比	long notlong	long:宽屏，如WQVGA,WVGA,FWVGA notlong: 非宽屏，如QVGA,HVGA和VGA 它完全基于屏幕的纵横比（宽屏较宽）而与屏幕方向无关
屏幕方向	port land	port: 设备处于纵向 land:设备处于横向
UI模式	car desk television appliance watch	car:设备正在车载手机上显示 desk: 设备正在桌面上显示 television: 设备正在电视上显示 appliance: 设备用作不带显示屏的设备 watch：设备用在手表上显示可以使用UiModeManager来启用或者禁用某些模式
夜间模式	night notnight	night: 夜间 notnight: 白天可以使用UiModeManager来启用或者禁用夜间模式
屏幕像素密度	ldpi mdpi hdpi xhdpi xxhdpi xxxhdpi nodpi tvdpi	ldpi:低密度屏幕，约为120dp mdpi: 中等密度屏幕，约为160dp hdpi: 高密度屏幕，约为240dpi xhdpi: 超高密度屏幕，约为320dpi 超超高密度屏幕，约为480dpi 超超超高密度屏幕，约为640dpi nodip:它可用于不像进行缩放以匹配设备密度的位图资源 tvdpi: 密度介于mdpi和hdpi之间的屏幕，约为213dpi,主要用于电视
触摸屏类型	notouch finger	notouch: 设备没有触摸屏 finger:设备有一个专供用户利用手指进行交互的触摸屏
键盘可用性	keysexposed keyshidden keyssoft	keysexposed: 设备具有可用键盘，无论是硬键盘还是软键盘，只有二者有可用的，这个限制符都会起作用 keyshidden: 设备具有可用的硬键盘，但它处于隐藏状态，其没有启用软键盘设备已经启用了软键盘
主要文本输入法	nokeys qwerty 12key	nokeys: 设备没有用于文本输入的硬键盘 qwerty: 设备具有标准硬键盘 12key: 设备具有12键硬键盘
导航可用性	navexposed navhidden	navexposed: 导航可供用户使用 navhidden: 导航不可用
主要非触摸导航方法	nonav dpad trackball wheel	nonav: 除了使用触摸屏外，设备没有其他导航设施 dpad: 设备具有导航的方向键 trackball: 具有导航的轨迹球 wheel: 设备具有用于当行的方向盘（不常见）
平台版本 (API级别)	示例： v3 v4 v7 v21 等等	设备支持的Api级别，例如v21对应于Api级别21(带有Android21.0或更高版本系统的设备)

限定符命名规则

可以为单组资源指定多个限定符，并使用短划线分隔。例如，drawable-en-rUS-land适用于横板美国英语设备
限定符必须遵循上表的顺序
不能嵌套备用资源目录。例如： res/drawable/drawable-en/
值不区分大小写

对于每一种限定符只支持一个值。
创建别名资源

Drawable 别名
要创建指向drawable的别名，使用< bitmap>元素。例如：

<?xml version="1.0" encoding="utf-8"?>
<bitmap xmlns:android="http://schemas.android.com/apk/res/android"
    android:src="@drawable/icon_ca"/>

布局
要创建指向现有布局的别名，在< merge>中使用< include>元素：

<?xml version="1.0" encoding="utf-8"?>
<merge>
   <include layout="@layout/main_ltr"/>
</merge>

字符串和其他简单值

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <string name ="hello"> 你好</string>
    <string name ="helo">@string/hello</string>
</resources>

常用的UI设计模式

Toolbar
App bar
一种特殊的toolbar
Tabs
一般是位于屏幕的顶部，也有应用用于底部
Navigation Drawer
点击Appbar左上角图标(hamburger icon)或者手势向右划，唤出这个Drawer
List to Detail
Multi Pane
手机两个页面在平板中一个页面就显示完

主题和样式

    <?xml version="1.0" encoding="utf-8" ?>
    <resources>
        <style name="SimpleStyle">
            <item name="android:textColor">#ff252525</item>
        </style>
    </resources>