Android开发之UI

最新推荐文章于 2023-12-22 16:25:26 发布
最新推荐文章于 2023-12-22 16:25:26 发布
阅读量680 收藏
点赞数
分类专栏： android基础 文章标签： ui android开发
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/anwanfei/article/details/76572835
版权

###Android开发之UI

UI（User interface）概念

1、组成：android中UI通过 View （组件）和ViewGroup（容器）组成

2、层级结构

这里写图片描述

3、组件不能包含其他的东西的，容器是里面可以包含组件或容器

一、布局

1、线性布局LinearLayout
android:gravity 指定文字在控件中的对齐方式
android:layout_gravity: 指定控件在布局中的对齐方式
android:layout_weight: 按比例分配控件大小

2、相对布局RelativeLayout

3、帧布局FrameLayout
4、百分比布局

  • 出现原因：

Linerlayout可以按照比例指定控件大小，而RelativeLayout和Framelayout无法实现，故出现了百分比布局PercentRelativeLayout和PercentFrameLayout，他们是针对RelativeLayout和Framelayout的扩展，这样就可以轻松实现按照比例指定他们的大小

  • 使用

1.添加依赖compile 'com.android.support:percent:26.+'
2.具体使用

PercentFrameLayout

<?xml version="1.0" encoding="utf-8"?>
<android.support.percent.PercentFrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    tools:context="com.yunjiai.admin.anfly.MainActivity">

    <Button
        android:id="@+id/btn_start"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="left|top"
        android:text="开启服务"
        app:layout_heightPercent="20%"
        app:layout_widthPercent="50%" />

    <Button
        android:id="@+id/btn_stop"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="top|right"
        android:text="停止服务"
        app:layout_heightPercent="20%"
        app:layout_widthPercent="50%" />

    <Button
        android:id="@+id/bindService"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerInParent="true"
        android:layout_gravity="center|left"
        android:text="绑定服务"
        app:layout_heightPercent="20%"
        app:layout_widthPercent="50%" />

    <Button
        android:id="@+id/unbindService"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_below="@id/bindService"
        android:layout_centerInParent="true"
        android:layout_gravity="center|right"
        android:text="解绑服务"
        app:layout_heightPercent="20%"
        app:layout_widthPercent="50%" />

    <Button
        android:id="@+id/btn_map"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="bottom|left"
        android:text="map"
        app:layout_heightPercent="20%"
        app:layout_widthPercent="50%" />

</android.support.percent.PercentFrameLayout>

PercentRelativeLayout

<?xml version="1.0" encoding="utf-8"?>
<android.support.percent.PercentRelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:padding="20dp"
    tools:context="com.yunjiai.admin.anfly.MainActivity">

    <Button
        android:id="@+id/btn_start"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="开启服务"
        app:layout_heightPercent="20%"
        app:layout_widthPercent="40%" />

    <Button
        android:id="@+id/btn_stop"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentRight="true"
        android:layout_gravity="top|right"
        android:text="停止服务"
        app:layout_heightPercent="20%"
        app:layout_widthPercent="40%" />

    <Button
        android:id="@+id/bindService"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_below="@id/btn_stop"
        android:text="绑定服务"
        app:layout_heightPercent="20%"
        app:layout_widthPercent="40%" />

    <Button
        android:id="@+id/unbindService"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentRight="true"
        android:layout_below="@id/btn_stop"
        android:text="解绑服务"
        app:layout_heightPercent="20%"
        app:layout_widthPercent="40%" />

    <Button
        android:id="@+id/btn_map"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_below="@id/unbindService"
        android:text="map"
        app:layout_heightPercent="20%"
        app:layout_widthPercent="40%" />

</android.support.percent.PercentRelativeLayout>

5、约束布局
6、表格布局TableLayout

android:layout_span=”2” 将两列合并为一列

在TableRow中无法指定控件的宽度，通过android:stretchColumns=”1”，指定将第二列拉伸到最大。

7、网格布局GridLayout
8、绝对布局AbsoluteLayout

还以用张洪祥的androidAndroidAutoLayout
二、常用控件

1、textview

text 显示的文本
textSize 文本大小
textColor 文本颜色
maxLines 最大行数
singleLine 是否单行显示
ellipsize  实现跑马灯，多余文字显示成...
ellipsize("middle")--一行中间有三个点；ellipsize("start")--一行开头有三个点；ellipsize("marquee")+focus+运行程序，实现跑马灯drawableLeft/drawableRight 显示图标
textscale：字间距
lineSpacingMultipier：行间距

显示HTML格式的数据：textview.settext(HTML.fromHtml(Stirng));

图文混排的实现：①SpannableStringBulder②Html.fromHtml(sb.tostring(),imageGetter,null);

设置下划线：①textview.getPaint().setFlags(Paint.UNDERLINE_TEXT_FLAG);

drawableleft功能：
设置图片的大小：
Drawable drawable1 = getResources().getDrawable(R.drawable.login_user); drawable1.setBounds(0, 0, 40, 40);//第一0是距左边距离，第二0是距上边距离，40分别是长宽 editText1.setCompoundDrawables(drawable1, null, null, null);//只放左边

TextView设置跑马灯必备属性：

android:ellipsize="marquee"
android:focusable="true"
android:singleLine="true"
android:marqueeRepeatLimit="marquee_forever"
android:focusableInTouchMode="true"

2、edittext

①TextView的子类
②hint 提示文字
③inputType 输入类型，可以设置成密码。inputType=“textPassword”
这里写图片描述
④addTextChangedListener在Editext有变化的时候的监听
⑤et.requestFocus();//获取焦点 光标出现
⑥mEditText.clearFocus();//失去焦点
⑦监听edittext焦点变化，当焦点获取后hasFocus为ture

etSearch.setOnFocusChangeListener(new View.OnFocusChangeListener() {
            @Override
            public void onFocusChange(View view, boolean hasFocus) {
                if (hasFocus) {
                    // 此处为得到焦点时的处理内容 
                } else {
                    // 此处为失去焦点时的处理内容
                }
            }
        });

⑦在xml中控制光标的android:cursorVisible="true" true为显示，false为隐藏
⑧不自动获取焦点：父级控件上设置android:focusableInTouchMode="true"
⑨设置光标颜色：android:textCursorDrawable="#ff2244"
如果想让光标颜色和字体颜色一样：android:textCursorDrawable="@null"

3、Button

textview的子类

4、Imageview
ImageView：src 图片

加载文件中的图片:

File file  = new File(path);
if(file.exists()){
      	 Bitmap bm = BitmapFactory.decodeFile(path);
       	img.setImageBitmap(bm);
}

5、Radiogroup
作用：将多个RadioButton组成一组，里面的单选按钮只能选一个
属性：orientation
方法：getCheckedRadioButtonId
监听器：OncheckedChangeListener，选择内部的RadioButton

设置Android中RadioButton的图片大小和位置（TextView一样）：http://blog.csdn.net/weixin_36723200/article/details/53577015

6、radiobutton

特点：一组单选按钮只能选一个，通过RadioGroup包起来，通常要和RadioGroup配合使用
属性：

text  显示的文本
checked 默认是否选中 ：true | false
button="@null"：隐藏小圆点
OncheckedChangeListener：监听器

7、CheckBox

特点：一组复选框可以选多个
属性：

text  显示的文本
checked 默认是否选中 ：true | false

可以实现按钮两种颜色切换，不是点击后手指离开即恢复原来颜色，是改变

<CheckBox
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:button="@drawable/selector_test" />
        
//选择器
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:drawable="@drawable/ic_published_tab" android:state_checked="true" />
    <item android:drawable="@drawable/ic_publish_tab"  android:state_checked="false" />
</selector>

8、listview

9、GridView

10、scrollview

11、recyclerview

12、ExpandableListView

13、switch

14、FloatingActionButton

15、DatePicker

16、TimePicker

17、pickerMum

18、cartview

19、webview

20、对话框

设置对话框在activity的位置
Dialog dialog = new Dialog(this);
dialog.setContentView(R.layout.dialog_layout);
dialog.setTitle(“Custom Dialog”);

//获得当前窗体
Window window = dialog.getWindow();

//重新设置
WindowManager.LayoutParams lp = window .getAttributes();
window .setGravity(Gravity.LEFT | Gravity.TOP);
lp.x = 100; // 新位置X坐标
lp.y = 100; // 新位置Y坐标
lp.width = 300; // 宽度
lp.height = 300; // 高度
lp.alpha = 0.7f; // 透明度

// dialog.onWindowAttributesChanged(lp);
//(当Window的Attributes改变时系统会调用此函数)
window .setAttributes(lp);
dialog.show();

21、进度条

22、侧滑菜单

23、seekbar
http://blog.csdn.net/jiang_rong_tao/article/details/60141198

24、viewpager

25、tablayout

26、toggleButton

27、AutoCompleteTextView自动完成功能的可编辑文本控件

28、MultiAutoCompleteTextView支持自动完成功能的可编辑文本控件，允许输入多值（多值之间会自动地用指定的分隔符分开）

29、ZoomControls-放大/缩小钮控件

30、Include-整合控件

31、VideoView

32、VideoView视频播放控件

33、mediaplayer

34、RatingBar-评分控件

35、Spinner下拉框控件

36、Chronometer计时器控件

37、CountDownTimer

三、自定义view

四、样式和主题

作用：
①实现属性的复用
②实现风格的统一
③容易修改，容易维护

**1、样式：**用于设置组件的风格

使用步骤：
①在res/values/styles.xml定义样式

	<style name="">
		<item name="属性名">属性值</item>
	</style>

②在布局xml中引用

<组件标签
		style="@style/xx"
	/>

**2、主题：**用于设置Activity界面的风格

使用步骤
①在res/values/styles.xml定义样式

<style name="" parent="">
	<item name="属性名">属性值</item>
</style>

②在清单列表中引用

<activity
		theme="@style/xx"
	/>

五、屏幕适配

1、基本概念

安卓飞
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
安卓UI简单开发
qq_39176095的博客
05-18 1043
1、常用UI组件 1.1 TextView match_parent:当前控件的大小和父布局一样 wrap_content:当前控件的大小能够刚好包住里面的内容 文字对齐方式：android:gravity=“center|top|bottom|left|right” 文字大小：android:textSize=“24sp” 文字颜色：android:textColor="#00ff00" 1.2 Button android:textAllCaps="false" #禁止大写转换 注册监听事
android system ui 开发,Android10 SystemUI之SystemUI
weixin_35473679的博客
05-27 878
SystemUI类是SystemUI应用中一些子服务的基类。public abstract class SystemUI implements SysUiServiceProvider {public Context mContext;public Map, Object> mComponents;//根据Class存放共享对象public abstract void start();//启...
android UI开发
qq_52175048的博客
01-12 818
android UI开发1.布局的创建2.布局类型2.1线性布局2.2相对布局 1.布局的创建 Android 程序中界面是通过布局文件设定的，在每个应用程序创建时会默认包含一个主界面布局，该布局位于 res/layout 目录中。由于实际开发中每个应用程序都包含多个界面，而程序默认提供的一个主界面布局无法满足需求，因此经常会在程序中添加多个布局。添加布局的过程非常简单，首先选中 layout文件夹并单击右键，依次选中[ New 】→【 XML 】→ 【Layout XML File 】 Layout F
Android UI开发
巧克力布丁的博客
04-16 468
文章目录一、布局的创建二、布局的类型1. LinearLayout（线性布局）2. RelativeLayout（相对布局）3. FrameLayout（帧布局）4. TableLayout（表格布局）5. AbsoluteLayout（绝对布局）三、常用控件1. TextView（文本框）2. EditText（编辑框）3. Button（按钮）(1). Button点击方式一：在布局中指定onClick属性(2). Button点击方式二：使用匿名内部类(3). Button点击方式三：在当前Activ
Android-UI开发
qq_52141922的博客
01-16 540
Android的UI开发 一.常用控件 1.TextView
Android-UI开发(一)
canghieever的博客
04-10 3132
常用控件 TextView 它主要用于在界面上显示一段文本信息 <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:orientation="vertical" android:layout_width="match_parent" android:layout_height="match_parent"> <TextView android:id="@+i.
安卓Android源码——ui开发类库示例源码.zip
10-14
在安卓（Android）平台上进行UI（用户界面）开发是一项至关重要的任务，因为它直接影响到应用程序的用户体验。本资源“安卓Android源码——ui开发类库示例源码.zip”提供了丰富的UI开发示例，帮助开发者更好地理解和...
Android开发+UI设计+漂亮的界面+界面开发实战：android 漂亮的UI界面 完整的界面设计
最新发布
04-19
本资源包“Android开发+UI设计+漂亮的界面+界面开发实战：android 漂亮的UI界面 完整的界面设计”专为Android开发者提供了一套完整的界面设计方案和实现代码，旨在帮助开发者创建具有吸引力的用户界面(UI)。...
android 漂亮的UI界面 完整的界面设计
02-17
声明：这也是我学习时在网上下载的，鉴于分享精神，并且觉得很不错才上传...android 漂亮的UI界面 完整的界面设计 这是一个完整的UI设计，但是没写动作，这是一个公司程序员的公司任务设计，请别商用，要用请修改。。。
Android项目开发之UI设计器
01-04
开发人员可以用以下两种方式声明UI：一是通过.xml文件（不带预览界面）或者.axml文件（带预览界面）来描述；二是用C#代码实现。  用.axml文件描述用户界面（UI）时，设计器分为【设计】视图和【源】视图。这种方式...
Android UI设计
12-08
Android UI设计
安卓开发UI设计
12-13
移动客户端安卓开发，主要设计了客户端的前端，安卓软件的UI设计，几乎用到了安卓UI设计的各个模块。各种安卓开发的逻辑模式和组件。
Android UI开发第一篇——android的九宫格式实现
weixin_30892889的博客
10-26 165
今天在devdiv论坛里看到有坛友问到九宫格的实现，我把我在项目中用的经验分享一下。代码地址：http://download.csdn.net/detail/xyz_lmn/5151879xml代码：<?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android....
Android-UI开发(二)
canghieever的博客
05-04 500
创建自定义控件 常用控件和布局的继承结构 View是Android中最基本的一种UI组件，它可以在屏幕上绘制一块矩形区域，并能响应这块区域的各种事件，因此，我们使用的各种控件其实就是在View的基础上又添加了各自特有的功能。而ViewGroup则是一种特殊的View，它可以包含很多子View和子ViewGroup，是一个用于放置控件和布局的容器 所有控件都是直接或间接继承自View的， 所有布局都是直接或间接继承自ViewGroup的 当系统自带的控件并不能满足我们的需求时，可以利用上面的继承结构来创
安卓开发——UI界面开发
2302_76442372的博客
03-03 5270
安卓实验：UI界面（微信界面）
Android开发 UI组件
qq_41440031的博客
09-22 238
布局管理器 线性布局（linearLayout） 常用属性： android:id android:layout_width android:layout_height android:background //自定义背景颜色 图片 android:layout_margin //外边距，距离外部元素的边距 android:layout_padding //内边距 android:orintation //线性布局的方向 <?xml version="1.0" enco...
Android MVI架构之UI开发指南
虎哥LoveDroid
12-22 1253
如果您使用的是一次性API或本地业务逻辑，请使用或在状态持有者中存储状态。然后，将其公开为StateFlow或。当源类型是作为Flow提供的外部流时，您应该公开一个StateFlow。如果您同时处理两种类型的输入，例如至少有一个外部流，请组合所有输入，并将UI状态公开为StateFlow。
Android 最佳实践之 UI 篇
03-28 968
http://sr1.me/way-to-explore/2015/03/25/best-practice-for-android-ui.html 引子 不管进行什么开发，桌面也好、移动端也罢，UI一直都是让人头大的一部分。那对于Android开发来说，在UI这一块，是否有什么最佳实践能让人少走一些弯路吗？这两天就这个问题搜了一圈，收获了不少。 UI最佳实践的N条建议
android开发之UI
m0_55456955的博客
08-13 2982
这是一篇关于android开发的UI部分的笔记，其中包括布局，布局中常用的单位以及一个计算器UI的小例子。
Android开发：UI基础控件详解
在Android开发中，构建用户界面（UI）是至关重要的，它直接影响到应用程序的用户体验。本篇将详细讲解Android UI中的基本控件，包括文本、按钮、状态开关、单选与复选按钮、图片以及日期与时间选择等。 首先，我们...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值