转载请注明本文出自JFlex的博客http://blog.csdn.net/jflex/article/details/46476599,请尊重他人的辛勤劳动成果,谢谢!
导读 :Android UI入门,对于很多人来讲都是比较简单的,教程也多如牛毛,但是这篇绝对和其他的不一样。从接触android开发就注定UI开发是一个一直需要研究的课题,简单的原生UI使用可能你已经掌握,也可能发现某些组件有着一些不爽,但是只要你搞懂原因,就可以了。实在觉得用着不爽,那么就让自己的UI开发能力变强,然后自己写个好点的。android UI开发需要先学会使用原生UI,然后在学会使用开源UI,最后才是自定义UI。按照这个顺序才会不断提升android UI开发的能力,一定要循序渐进。
xml的UI示例(必须了解XML知识)
示例:res/layout/activity_main.xml
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="10dp"
android:text="这是一个TextView" />
</LinearLayout>
1、layout的组成:跟标签可以是任意组件,但是只有继承ViewGroup的组件才能包含子控件
2、命名空间:android自带的命名空间,当然自定义组件的时候,需要自定义命名空间
3、android的组件属性:基本上都是按照英文单词定义的,所以大部分都是很好理解,只需要多多练习就会记住
code的UI示例(必须熟悉java语言)
示例:com/snicesoft/testlayout/MainActivity.java
public class MainActivity extends Activity{
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
//setContentView(R.layout.activity_main);
LinearLayout layout = new LinearLayout(this);
setContentView(layout);
TextView textView = new TextView(this);
textView.setText("我是代码创建的TextView");
layout.addView(textView);
}
}
这里只是简单的例子。当然一般情况,xml实现的布局都可以通过java代码实现,但是尽管这样,还是推荐使用xml控制布局,这样灵活性比较好,能够分离UI。
可能大家忽略一个问题,eclipse、android studio等IDE都提供了可视化界面开发,为啥没提到。这里说明下,可视化操作往往不能满足更加细致的UI制作,只能简单生成控件的轮廓代码,如果需要制作精细的UI,那么建议还是手动编写xml,当然也不是很难,毕竟代码提示还是很方便的。
color的使用
color基本上都需要存放在res\values\colors.xml
或者res\color\
colors.xml
<?xml version="1.0" encoding="utf-8"?>
<resources>
<color name="menu_txt_default">#333333</color>
<color name="menu_txt_checked">#48D1CC</color>
</resources>
注意:图片仅支持png和jpg
分辨率适配是android开发必备的技能。
一般的处理方式是:一份layout,通过不同分辨率的values中定义dimens处理不同分辨率需要的组件尺寸。
1. 常用布局
LinearLayout:线性布局,垂直和水平设置,使用比较多
RelativeLayout:相对布局,使用比较多
FrameLayout:层布局,多层View叠加处理。
TableLayout:表格布局,就像html中的table一样
2. 多使用dimens
<inflate>
android命名空间常用属性
- 宽度:layout_width
取值:wrap_parent(根据内容动态计算)、match_parent(占满父布局)和具体的dp
平台 | android | iOS | html |
---|---|---|---|
layout_width | width | width |
- 高度:layout_height
取值:wrap_parent、match_parent和具体的dp
平台 | android | iOS | html |
---|---|---|---|
layout_height | height | height |
- layout_gravity
平台 | android | iOS | html |
---|---|---|---|
layout_gravity | 无 | 无 |
- gravity
平台 | android | iOS | html |
---|---|---|---|
gravity | 无 | 无 |
- 距离自身控件间距:padding
平台 | android | iOS | html |
---|---|---|---|
padding | 无 | padding |
- paddingLeft
平台 | android | iOS | html |
---|---|---|---|
paddingLeft | 无 | padding |
- paddingTop
平台 | android | iOS | html |
---|---|---|---|
paddingTop | 无 | padding |
- paddingRight
平台 | android | iOS | html |
---|---|---|---|
paddingRight | 无 | padding |
- paddingBottom
平台 | android | iOS | html |
---|---|---|---|
paddingRight | 无 | padding |
- 距离父控件间距:margin
平台 | android | iOS | html |
---|---|---|---|
margin | 无 | margin |
- marginLeft
平台 | android | iOS | html |
---|---|---|---|
marginLeft | 无 | margin |
- marginTop
平台 | android | iOS | html |
---|---|---|---|
marginTop | 无 | margin |
- marginRigth
平台 | android | iOS | html |
---|---|---|---|
marginRigth | 无 | margin |
- marginBottom
平台 | android | iOS | html |
---|---|---|---|
marginBottom | 无 | margin |
平台 | android | iOS | html |
---|---|---|---|
orientation | 无 | 无 |
RelativeLayout主要属性配置其实是在其子控件中配置,一下是常用的属性
比如ListView:当ListView的height设置为wrap_parent,则会出现getView重复执行;设置match_parent则正常
嵌套常会出现ListView或者GridView的高度只显示一行,需要重写onMeasure方法
默认overScroll是有颜色动画,本身是实现了类似iOS的反弹效果,但是为了避让iOS的反弹效果专利,将其隐藏了。
此博文将会不定期更新,因时间和思考不全面,当考虑到了将会添加进来,希望大家多多提意见。
Android UI之原生——(1)、Android UI入门及常见属性与现象
原文地址:http://blog.csdn.net/jflex/article/details/46476599