使用 自定义布局 实现灵活的万能遥控器界面
2024-06-12 11:38:46
首先，看下效果图
拿到这个图片我第一想到的是用GridLayout来写，但是写出来代码比较繁琐，很 麻烦，于是考虑到这样写：
1. 先把整个布局写好
<LinearLayoutandroid:layout_width="match_parent"android:layout_height="match_parent"android:layout_marginLeft="@dimen/x35"android:layout_marginRight="@dimen/x35"android:layout_weight="1"android:background="@mipmap/remote_tv_bj"><include layout="@layout/activity_remote_keyboard"></include></LinearLayout>2.然后写 include里面的布局
a.
activity_remote_keyboard <pre name="code" class="html"><pre name="code" class="html"> <?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="match_parent"android:orientation="vertical"android:padding="12dp"><LinearLayout style="@style/remote_line"><TextViewandroid:layout_width="match_parent"android:layout_height="match_parent"android:gravity="center"android:text="电视机"android:textColor="@color/colorPrimaryDark"android:textSize="18sp" /></LinearLayout><LinearLayout style="@style/remote_line"><LinearLayout style="@style/remote_kb"><ImageViewandroid:id="@+id/turn_off_tv"android:layout_width="wrap_content"android:layout_height="wrap_content"android:src="@mipmap/remote_tv_close" /></LinearLayout><LinearLayout style="@style/remote_kb"><ImageViewandroid:id="@+id/add_voice"android:layout_width="wrap_content"android:layout_height="wrap_content"android:src="@mipmap/add_voice" /></LinearLayout><LinearLayout style="@style/remote_kb"><ImageViewandroid:id="@+id/reduce_voice"android:layout_width="wrap_content"android:layout_height="wrap_content"android:src="@mipmap/reduce_voice" /></LinearLayout><LinearLayout style="@style/remote_kb"><TextViewandroid:id="@+id/switch_tv"android:layout_width="wrap_content"android:layout_height="wrap_content"android:text="TV/AV"android:textColor="@color/colorPrimaryDark" /></LinearLayout></LinearLayout><Viewandroid:layout_width="match_parent"android:layout_height="1.5dp"android:layout_margin="4dp"android:background="@mipmap/remote_tv_edix" /><LinearLayout style="@style/remote_line"><LinearLayout style="@style/remote_kb"><ImageViewandroid:id="@+id/turn_on_tv"android:layout_width="wrap_content"android:layout_height="wrap_content"android:src="@mipmap/remote_tv_open" /></LinearLayout><TextViewandroid:layout_width="0dp"android:layout_height="match_parent"android:layout_weight="2"android:gravity="center"android:text="机顶盒"android:textColor="@color/colorPrimaryDark"android:textSize="18sp" /><LinearLayout style="@style/remote_kb"><TextViewandroid:id="@+id/mute"style="@style/remote_kb_text"android:text="静音" /></LinearLayout></LinearLayout><LinearLayout style="@style/remote_line"><LinearLayout style="@style/remote_kb"><TextViewandroid:id="@+id/tv_1"style="@style/remote_kb_text"android:text="1" /></LinearLayout><LinearLayout style="@style/remote_kb"><TextViewandroid:id="@+id/tv_2"style="@style/remote_kb_text"android:text="2" /></LinearLayout><LinearLayout style="@style/remote_kb"><TextViewandroid:id="@+id/tv_3"style="@style/remote_kb_text"android:text="3" /></LinearLayout><LinearLayout style="@style/remote_kb"><TextViewandroid:id="@+id/add_channel"style="@style/remote_kb_text"android:text="频道 +" /></LinearLayout></LinearLayout><LinearLayout style="@style/remote_line"><LinearLayout style="@style/remote_kb"><TextViewandroid:id="@+id/tv_4"style="@style/remote_kb_text"android:text="4" /></LinearLayout><LinearLayout style="@style/remote_kb"><TextViewandroid:id="@+id/tv_5"style="@style/remote_kb_text"android:text="5" /></LinearLayout><LinearLayout style="@style/remote_kb"><TextViewandroid:id="@+id/tv_6"style="@style/remote_kb_text"android:text="6" /></LinearLayout><LinearLayout style="@style/remote_kb"><TextViewandroid:id="@+id/reduce_channel"style="@style/remote_kb_text"android:text="频道 —" /></LinearLayout></LinearLayout><LinearLayout style="@style/remote_line"><LinearLayout style="@style/remote_kb"><TextViewandroid:id="@+id/tv_7"style="@style/remote_kb_text"android:text="7" /></LinearLayout><LinearLayout style="@style/remote_kb"><TextViewandroid:id="@+id/tv_8"style="@style/remote_kb_text"android:text="8" /></LinearLayout><LinearLayout style="@style/remote_kb"><TextViewandroid:id="@+id/tv_9"style="@style/remote_kb_text"android:text="9" /></LinearLayout><LinearLayout style="@style/remote_kb"><TextViewandroid:id="@+id/add_jd_voice"style="@style/remote_kb_text"android:text="音量 +" /></LinearLayout></LinearLayout><LinearLayout style="@style/remote_line"><LinearLayout style="@style/remote_kb"><TextViewandroid:id="@+id/tv_ok"style="@style/remote_kb_text"android:text="确认" /></LinearLayout><LinearLayout style="@style/remote_kb"><TextViewandroid:id="@+id/tv_0"style="@style/remote_kb_text"android:text="0" /></LinearLayout><LinearLayout style="@style/remote_kb"><TextViewandroid:id="@+id/tv_information"style="@style/remote_kb_text"android:text="信息" /></LinearLayout><LinearLayout style="@style/remote_kb"><TextViewandroid:id="@+id/remote_jd_voice"style="@style/remote_kb_text"android:text="音量 —" /></LinearLayout></LinearLayout><LinearLayout style="@style/remote_line"><LinearLayout style="@style/remote_kb"><TextViewandroid:id="@+id/tv"style="@style/remote_kb_text"android:text="电视" /></LinearLayout><LinearLayout style="@style/remote_kb"><TextViewandroid:id="@+id/tv_custom1"style="@style/remote_kb_text"android:text="自定义" /></LinearLayout><LinearLayout style="@style/remote_kb"><TextViewandroid:id="@+id/tv_custom2"style="@style/remote_kb_text"android:text="自定义" /></LinearLayout><LinearLayout style="@style/remote_kb"><TextViewandroid:id="@+id/tv_back"style="@style/remote_kb_text"android:text="返回" /></LinearLayout></LinearLayout>
</LinearLayout>3. styles.xml
<!-- 电视机机顶盒样式--><style name="remote_line"><item name="android:layout_weight">1</item><item name="android:layout_width">match_parent</item><item name="android:layout_height">0dp</item><item name="android:orientation">horizontal</item></style><!-- 电视机机顶盒按键样式--><style name="remote_kb"><item name="android:clickable">true</item><item name="android:gravity">center</item><item name="android:layout_weight">1</item><item name="android:layout_height">match_parent</item><item name="android:layout_width">0dp</item><item name="android:background">@drawable/remote_kb</item><item name="android:layout_margin">4dp</item></style>
这样就OK了~~
使用 自定义布局 实现灵活的万能遥控器界面相关推荐
- android 开发打赏布局,Android自定义View模仿虎扑直播界面的打赏按钮功能
Android自定义View模仿虎扑直播界面的打赏按钮功能 发布时间:2020-09-28 12:15:53 来源:脚本之家 阅读:77 作者:shenhuniurou 前言 作为一个资深篮球爱好者, ...
- re管理器Java_自定义布局管理器-FormLayout
第二部分:自定义布局管理器 在java.awt包与javax.swing包下有许多现成的布局类,比如BorderLayout.FlowLayout,还有较为复杂的.用于精确定位的布局类GridBagL ...
- 从自定义TagLayout看自定义布局的一般步骤[手动加精]
从自定义TagLayout看自定义布局的一般步骤[手动加精] 我们常用的布局有LinearLayout,FrameLayout,RelativeLayout,大多数情况下都能满足我们的需求,但是也有很 ...
- Swift - 使用网格（UICollectionView）的自定义布局实现复杂页面
网格UICollectionView除了使用流布局,还可以使用自定义布局.实现自定义布局需要继承UICollectionViewLayout,同时还要重载下面的三个方法: 1 2 3 4 5 6 7 ...
- 【Android 性能优化】布局渲染优化 ( 过渡绘制 | 背景设置产生的过度绘制 | Android 系统的渲染优化 | 自定义布局渲染优化 )
文章目录 一. 背景设置产生的过度绘制 二. Android 系统的渲染优化 1. 透明组件数据传递 2. GPU 存储机制 3. Android 7.0 之后的优化机制 三. 自定义布局渲染优化 一 ...
- Android学习问题：关于AlertDialog中自定义布局带有的EditText无法弹出键盘
最近在用到AlertDialog的时候,自定义了其布局文件,其中带有EditText,但是发现在手机上使用的时候,点击EditText却没有弹出键盘,在网上搜索了下,看到有好几种解决方法,试过其中一些 ...
- 论__AlertDialog自定义布局回调修改的正确方式
论__AlertDialog自定义布局回调修改的正确方式 本文由 Luzhuo 编写,请尊重个人劳动成果,转发请保留该信息. 原文: http://blog.csdn.net/Rozol/articl ...
- element布局容器大小_Flutter完整开发实战详解(十六、详解自定义布局实战)
本篇将解析 Flutter 中自定义布局的原理,并带你深入实战自定义布局的流程,利用两种自定义布局的实现方式,完成如下图所示的界面效果,看完这一篇你将可以更轻松的对 Flutter 为所欲为. 文章汇 ...
- android 自定义布局 根据布局获取类,android自定义布局中的平滑移动之ViewGroup实现...
在android应用程序的开发过程中,相信我们很多人都想把应用的交互做的比较绚丽,比如让界面切换平滑的滚动,还有热度灰常高的伪3D等界面效果,通常情况下,系统提供的应用在特效这方面只能为我们提供简单的 ...
最新文章
- [转] JavaScript：彻底理解同步、异步和事件循环(Event Loop)
- 进一步考察与UI相关的安全漏洞-上
- OpenGL Cube Map立方体贴图的实例
- 百度推出 MIP Baidu Path链接
- ffbe攻略站_最终幻想勇气启示录ffbe兵员强化攻略
- Win7下使用openssl时出现“Unable to write ‘random state’‘的问题
- C#中，控制台模式可以使用定时器吗？
- IAR常用快捷键及技巧
- 1208. 尽可能使字符串相等
- Echarts实现区级行政区划地图
- 2013.11.18周例会小结
- 各代iphone尺寸_iPhone12与历代iPhone尺寸对比曝光：比iPhone8还小？
- mantis使用介绍
- c语言cout函数,c++中cin与cout 详解
- HPD健康产品申明认证
- java--案例:[Random]随机100-200的数、班级点名器、控制台输入三个数，输出最大值，或最小值？
- django设置为中文语言
- repeat()方法
- springmvc入门：web.xml编写
- 联想教育应用使用说明（7.6版本）——第0章 目录