Android开发学习之路--UI之自定义布局和控件
来源:互联网 发布:html怎么调用php文件 编辑:程序博客网 时间:2024/05/18 17:59
新的一年已经开始了,今天已经是初二了,两天没有学习了,还是要来继续学习下。一般手机的title都是actionbar,就像iphone一样可以后退,可以编辑。这里自定义布局就来实现下这个功能,首先准备下三张图片,一张用来当作背景,两张分别表示后退和编辑。新建工程UICostomViewsTest,然后自动创建工程后,新建title.xml,编写代码如下:
<?xml version="1.0" encoding="utf-8"?><LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="wrap_content" android:background="@drawable/title_bg"> <Button android:id="@+id/title_back" android:layout_height="wrap_content" android:layout_width="wrap_content" android:layout_gravity="center" android:layout_margin="5dip" android:background="@drawable/back_bg" /> <TextView android:id="@+id/title_text" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_gravity="center" android:layout_weight="1" android:gravity="center" android:text="Title Text" android:textColor="#fff" android:textSize="24sp"/> <Button android:id="@+id/title_edit" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_gravity="center" android:layout_margin="5dip" android:background="@drawable/edit_bg"/></LinearLayout>
效果如下:
一般来说会有很多地方用到这个title,那么如果每个页面都要写这一段代码,那么代码也太冗余了,这里可以使用include。再main_activity.xml里面添加该title,然后再搞一个textview和button。代码编写如下:
<?xml version="1.0" encoding="utf-8"?><TableLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent"> <include layout="@layout/title" /> <TextView android:text="Hello World!" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_margin="5dip" android:textSize="24dp" /> <Button android:id="@+id/button1" android:layout_width="match_parent" android:layout_height="wrap_content" android:text="Button1"/></TableLayout>
以上只要include 刚编写的title就可以了,这里主要用到了linear layout,所以这里用了tableLayout。效果如下:
虽然上面的title已经ok了,但是我们要实现back,edit的功能,需要响应事件才可以,那么这里再实现自己的控件。编写TitleLayout,代码如下:
package com.example.jared.uicustomviewstest;import android.content.Context;import android.util.AttributeSet;import android.view.LayoutInflater;import android.view.View;import android.widget.Button;import android.widget.LinearLayout;import android.widget.TextView;import android.widget.Toast;/** * Created by jared on 16/2/9. */public class TitleLayout extends LinearLayout { private Button back_button; private Button edit_button; private TextView title_text; public class MyOnclickListener implements View.OnClickListener { @Override public void onClick(View view) { switch (view.getId()) { case R.id.title_back: Toast.makeText(getContext(), "You clicked back button!", Toast.LENGTH_SHORT).show(); break; case R.id.title_edit: Toast.makeText(getContext(), "You clicked edit button!", Toast.LENGTH_SHORT).show(); break; default: break; } } } public TitleLayout(Context context, AttributeSet attrs) { super(context, attrs); LayoutInflater.from(context).inflate(R.layout.title, this); back_button = (Button)findViewById(R.id.title_back); edit_button = (Button)findViewById(R.id.title_edit); title_text = (TextView)findViewById(R.id.title_text); back_button.setOnClickListener(new MyOnclickListener()); edit_button.setOnClickListener(new MyOnclickListener()); }}
TitleLayout实现构造继承linearLayout,并在构造函数中实现了back,edit等的功能。触发按键可以打印些信息。
修改activity_main的xml,如下:
<?xml version="1.0" encoding="utf-8"?><TableLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent"> <com.example.jared.uicustomviewstest.TitleLayout android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_gravity="center"/> <TextView android:text="Hello World!" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_margin="5dip" android:textSize="24dp" /> <Button android:id="@+id/button1" android:layout_width="match_parent" android:layout_height="wrap_content" android:text="Button1" android:textAllCaps="false" /></TableLayout>
和一般的控件使用方法一样,这里是com.example.jared.uicuctomviewstest.TitleLayout,运行效果如下:有点丑,UI下次再好好改改。
基本上自定义控件差不多就这些了。
附:参考《第一行代码》
1 0
- Android开发学习之路--UI之自定义布局和控件
- Android开发之自定义布局和控件
- android开发之四种基本布局和自定义控件
- Android开发学习之路--UI之基本布局
- Android开发学习之路-自定义控件
- Android初级之路------->布局管理器和创建自定义控件
- Android开发之--自定义控件学习
- Android 自定义控件学习之二 简单布局实例
- Android应用开发学习笔记之开发自定义UI组件
- Android开发之布局和数据库学习
- android UI进阶之自定义组合控件
- android UI进阶之自定义组合控件
- android UI进阶之自定义组合控件
- android UI进阶之自定义组合控件
- android UI进阶之自定义组合控件
- android UI进阶之自定义组合控件
- android UI进阶之自定义组合控件
- android UI进阶之自定义组合控件
- 如何禁止App在后台运行以及如何保存和恢复App的状态
- 第六届蓝桥杯C/C++B组第七题 牌型种数(回溯)
- 基于C#的计算器(1) 带括号
- C++自制Redis数据库(八)基本数据结构--String
- SHUOJ 1553 滑雪问题(大数据)(BFS)
- Android开发学习之路--UI之自定义布局和控件
- 志不强者智不达
- uva 11538 组合
- Android Annotations环境搭建(Android Studio)
- Aireplay-ng的6种攻击模式详解
- ZOJ1061
- Self Summary: Basic concepts of GPU
- xsl-fo图文混排的问题解决
- uva 11401 荣斥