Skip to content

Commit a65c43f

Browse files
author
hongyangAndroid
committed
添加文档
1 parent ce6a7bc commit a65c43f

7 files changed

Lines changed: 167 additions & 5 deletions

File tree

‎README.md‎

Lines changed: 108 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,114 @@
11
# AndroidAutoLayout
22
Android屏幕适配方案，直接填写设计图上的像素尺寸即可完成适配。
33

4-
作者信息：[hongyangAndroid](https://github.com/hongyangAndroid),吃土豆的人
4+
非常感谢 ： 吃土豆的人 的协作。
5+
6+
## 效果图
7+
8+
最大幅度解决适配问题，并且最大化方便开发者。
9+
10+
so,看下用法：
11+
12+
<img src="autolayout_01.png"/>
13+
14+
15+
<img src="autolayout_02.png"/>
16+
17+
你没有看错，拿到设计稿，在布局文件里面直接填写对应的px即可，px:这里的px并非是Google不建议使用的px，在内部会进行转化处理。
18+
19+
看下不同分辨率下的效果：
20+
21+
768*1280,Andriod 4.4.4
22+
23+
24+
<img src="autolayout_03.png" width="320px"/>
25+
26+
480*800,Android 2.3.7
27+
28+
<img src="autolayout_04.png" width="320px"/>
29+
30+
31+
上述两个机器的分辨率差距相当大了，但是完美实现了适配，最为重要的是：
32+
33+
* 再也不用拿着设计稿去想这控件的宽高到底取多少dp
34+
* 再也不用去为多个屏幕去写多个dimens
35+
* 再也不用去计算百分比了（如果使用百分比控件完成适配）
36+
* 再也不用去跟UI MM去解释什么是dp了
37+
38+
你所要做的就是抄抄设计稿上面的px，直接写入布局文件。
39+
40+
还有很多好处，比如上面的Item里面元素比较多，如果标识的比较全面，一个FrameLayout，里面的View填写各种marginLeft,marginTop就能完美实现，几乎不需要嵌套了。
41+
42+
## 用法
43+
44+
* Android Studio
45+
46+
将[autolayout](autolayout)引入
47+
48+
```xml
49+
dependencies {
50+
compile project(':autolayout')
51+
}
52+
```
53+
54+
在你的项目的AndroidManifest中注明你的`设计稿`的尺寸。
55+
56+
```xml
57+
<meta-data android:name="design_width" android:value="768"></meta-data>
58+
<meta-data android:name="design_height" android:value="1280"></meta-data>
59+
60+
```
61+
62+
在你的Activity的onCreate里面写入：` AutoLayout.getInstance().auto(this, true);`
63+
64+
```xml
65+
@Override
66+
protected void onCreate(Bundle savedInstanceState)
67+
{
68+
super.onCreate(savedInstanceState);
69+
setContentView(R.layout.activity_main);
70+
71+
AutoLayout.getInstance().auto(this, true);
72+
}
73+
```
74+
75+
76+
## 目前支持属性
77+
78+
* layout_width
79+
* layout_height
80+
* layout_margin(left,top,right,bottom)
81+
* pading
82+
* textSize
83+
84+
85+
## 注意事项
86+
87+
* TextView的高度问题
88+
89+
设计稿一般只会标识一个字体的大小，比如你设置textSize="20px"，实际上TextView所占据的高度肯定大于20px，字的上下都会有一定的建议，所以一定要灵活去写字体的高度，比如对于text上下的margin可以选择尽可能小一点。或者选择别的约束条件去定位（比如上例，选择了marginBottom）
90+
91+
92+
93+
94+
95+
## 其他信息
96+
97+
作者信息：
98+
99+
* [hongyangAndroid](https://github.com/hongyangAndroid)
100+
* 吃土豆的人
101+
102+
103+
灵感来自：
104+
105+
* [android-percent-support-lib-sample](https://github.com/JulienGenoud/android-percent-support-lib-sample)
106+
* [android-percent-support-extend](https://github.com/hongyangAndroid/android-percent-support-extend)
107+
* [Android 屏幕适配方案](http://blog.csdn.net/lmj623565791/article/details/45460089)
108+
109+
110+
111+
5112

6-
目前正在测试中，文档稍后添加。
7113

8114

‎autolayout/src/main/java/zhy/com/autolayout/AutoLayoutHelper.java‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -279,15 +279,15 @@ public void fillMarginLayoutParams(ViewGroup.MarginLayoutParams params, int widt
279279
}
280280
if (marginLeft != 0)
281281
{
282-
params.leftMargin = (int) (marginLeft * 1.0f / mDesignHeight * mAvailaleHegiht);
282+
params.leftMargin = (int) (marginLeft * 1.0f / mDesignWidth * mAvailableWidth);
283283
}
284284
if (marginTop != 0)
285285
{
286286
params.topMargin = (int) (marginTop * 1.0f / mDesignHeight * mAvailaleHegiht);
287287
}
288288
if (marginRight != 0)
289289
{
290-
params.rightMargin = (int) (marginRight * 1.0f / mDesignHeight * mAvailaleHegiht);
290+
params.rightMargin = (int) (marginRight * 1.0f / mDesignWidth * mAvailableWidth);
291291
}
292292
if (marginBottom != 0)
293293
{

‎autolayout_01.png‎

319 KB
Loading

‎autolayout_02.png‎

479 KB
Loading

‎autolayout_03.png‎

76.6 KB
Loading

‎autolayout_04.png‎

81.5 KB
Loading

‎sample/src/main/res/layout/activity_main.xml‎

Lines changed: 57 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -47,7 +47,35 @@
4747
>
4848

4949
<TextView
50-
android:id="@+id/id_tv_name3"
50+
android:layout_width="wrap_content"
51+
android:layout_height="wrap_content"
52+
android:layout_marginLeft="22px"
53+
android:layout_marginTop="16px"
54+
android:text="王大炮 WANG.DAPAO"
55+
android:textColor="#333"
56+
android:textSize="28px"
57+
/>
58+
<TextView
59+
android:layout_width="wrap_content"
60+
android:layout_height="wrap_content"
61+
android:layout_alignParentBottom="true"
62+
android:layout_marginBottom="16px"
63+
android:layout_marginLeft="22px"
64+
android:text="护照：G50786449"
65+
android:textColor="#999"
66+
android:textSize="26px"
67+
/>
68+
69+
</zhy.com.autolayout.AutoRelativeLayout>
70+
71+
<zhy.com.autolayout.AutoRelativeLayout
72+
android:layout_width="match_parent"
73+
android:layout_height="108px"
74+
android:layout_marginTop="26px"
75+
android:background="#ffffffff"
76+
>
77+
78+
<TextView
5179
android:layout_width="wrap_content"
5280
android:layout_height="wrap_content"
5381
android:layout_marginLeft="22px"
@@ -71,8 +99,36 @@
7199

72100
</zhy.com.autolayout.AutoRelativeLayout>
73101

102+
<zhy.com.autolayout.AutoRelativeLayout
103+
android:layout_width="match_parent"
104+
android:layout_height="108px"
105+
android:layout_marginTop="26px"
106+
android:background="#ffffffff"
107+
>
108+
109+
<TextView
110+
android:layout_width="wrap_content"
111+
android:layout_height="wrap_content"
112+
android:layout_marginLeft="22px"
113+
android:layout_marginTop="16px"
114+
android:text="王大炮 WANG.DAPAO"
115+
android:textColor="#333"
116+
android:textSize="28px"
117+
/>
74118

75119

120+
<TextView
121+
android:layout_width="wrap_content"
122+
android:layout_height="wrap_content"
123+
android:layout_alignParentBottom="true"
124+
android:layout_marginBottom="16px"
125+
android:layout_marginLeft="22px"
126+
android:text="护照：G50786449"
127+
android:textColor="#999"
128+
android:textSize="26px"
129+
/>
130+
131+
</zhy.com.autolayout.AutoRelativeLayout>
76132

77133

78134
</zhy.com.autolayout.AutoLinearLayout>

0 commit comments

Comments
 (0)