【Android Studio】使用UI工具绘制,ConstraintLayout 限制性布局,快速上手

文章目录

  • 一、前言
  • 二、绘制效果
  • 三、ConstraintLayout 使用方法
    • 3.1 创建布局文件
    • 3.2 替换配置
    • 3.3 设置约束,步骤1
    • 3.4 设置约束,步骤2
    • 3.5 其他设置
  • 四、结束

一、前言

在进行Android APP开发过程中,减少layout嵌套即可改善UI的绘制性能;而ConstraintLayout 布局的出现,直接将Layout扁平化,并且得到了UI绘制工具的很好支持,本文即介绍其用法和注意事项,看完这一篇,即可掌握使用Android的UI工具,绘制APP的方法。

大家可以参考本文末尾的布局,自己练练,看看是不是一下子就掌握了呢?哈哈

作为一个捣鼓BSP的系统开发人员,偶尔也需要弄个APP,所以呢,不得已,搞了一把,在此分享给大家。

二、绘制效果

  • 先给大家看下最终的绘制效果
  • 本文demo的是一个TV Launcher界面的布局绘制
  • 特点:大屏幕、横屏模式,分辨率1920x1080

TV Launcher demo 布局

三、ConstraintLayout 使用方法

3.1 创建布局文件

  • 可随意创建一个布局文件
  • 再创建一个MainActivity来使用这个布局
<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"><applicationandroid:allowBackup="true"android:icon="@mipmap/ic_launcher"android:label="@string/app_name"android:supportsRtl="true"android:theme="@style/Theme.XLauncher"><activityandroid:name=".MainActivity"android:exported="true"><intent-filter><action android:name="android.intent.action.MAIN" /><category android:name="android.intent.category.LAUNCHER" /></intent-filter></activity></application></manifest>

3.2 替换配置

  • 按如下格式修改
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout 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"tools:context=".MainActivity">  备注:此处必须捆绑一个Activity<Buttonandroid:id="@+id/button2"android:layout_width="146dp"android:layout_height="45dp"android:layout_marginStart="32dp"android:layout_marginTop="16dp"android:text="Button"app:layout_constraintStart_toStartOf="parent"app:layout_constraintTop_toTopOf="parent" /></androidx.constraintlayout.widget.ConstraintLayout>

3.3 设置约束,步骤1

  • 任何一个控件,只需要给出一个一个(x, y)的定位约束,即可

在这里插入图片描述

3.4 设置约束,步骤2

  • 此处是步骤2,也是第一次2种方法,可以将控件约束到已经固定好的控件上
  • 同样只需要固定一个x,y组合即可
    在这里插入图片描述

3.5 其他设置

不用多说了,没有其他了,掌握上面2个就可以开始了,剩余的各位一用即懂了。

四、结束

  • 各位也可参考本文布局,自己试试,是不是一下子,就掌握了~HOHO
    在这里插入图片描述

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.rhkb.cn/news/327626.html

如若内容造成侵权/违法违规/事实不符,请联系长河编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

在阿里云服务器上安装MySQL

目录 一、先卸载不需要的环境 1.关闭MySQL服务 2.查看安装包以及卸载安装包 3.依次卸载所有包 4. 获取mysql官⽅yum源 二、安装&#xff08;密钥过期解决方法&#xff09; 三、启动并进入 关于MySQL MySQL是一个广泛使用的开源关系型数据库管理系统&#xff08;RDBMS&…

嵌入式学习-通用定时器

简介 框图介绍 时钟选择 计数器部分 输入捕获和输出比较框图 嵌入式学习全文参考&#xff08;小向是个der&#xff09;做笔记&#xff1a;https://blog.csdn.net/qq_41954556/article/details/129735708

单区域OSPF实验

实验目的&#xff1a; 理解OSPF的基本概念。掌握单曲于OSPF的配置掌握OSPF邻居状态的解读掌握通过Cost控制OSPF选路的方法掌握OSPF认证的配置方法 一、基础配置&#xff1a; 搭建实验拓扑图&#xff1b; 配置路由器接口的IP地址以及配置环回地址待后续使用 &#xff08;1&a…

Patch-Wise Graph Contrastive Learning for Image Translation

Patch-Wise Graph Contrastive Learning for Image Translation 图像翻译中的逐块图对比学习 Chanyong Jung1, Gihyun Kwon1, Jong Chul Ye1, 2 Chanyong Jung&#xff0c;Gihyun Kwon&#xff0c;Jong Chul Ye 1, 2 Abstract 摘要 Patch-Wise Graph Cont…

[MRCTF2020]PixelShooter

是个安卓游戏题 re手肯定不会去玩游戏&#xff0c;先jadx分析一波 没有什么关键信息&#xff0c;但找到了一个unity类&#xff0c;想到apk也可以解压缩得到 .so 或者 Assembly-CSharp.dll 故又在dnspy分析一下 看了半天没有和flag有关信息&#xff0c;看wp&#xff1a; Asse…

(docker)进入容器后如何使用本机gpu

首次创建容器&#xff0c;不能直接使用本机gpu 在系统终端进行如下配置&#xff1a; 1.安装NVIDIA Container Toolkit 进入Nvidia官网Installing the NVIDIA Container Toolkit — NVIDIA Container Toolkit 1.15.0 documentation&#xff0c;安装NVIDIA Container Toolkit …

在idea中使用vue

一、安装node.js 1、在node.js官网&#xff08;下载 | Node.js 中文网&#xff09;上下载适合自己电脑版本的node.js压缩包 2、下载完成后进行解压并安装&#xff0c;一定要记住自己的安装路径 一直点击next即可&#xff0c;这部选第一个 3、安装成功后&#xff0c;按住winR输入…

kafka学习笔记04(小滴课堂)

Kafka的producer生产者发送到Broker分区策略讲解 Kafka核心API模块-producer API讲解实战 代码&#xff1a; ProducerRecord介绍和key的作用 Kafka核心API模块-producerAPI回调函数实战 producer生产者发送指定分区实战 我们设置5个分区。 我们指定分区。 重新指定一个分区&am…

前端动画requestAnimationFrame

window.requestAnimationFrame() 告诉浏览器——你希望执行一个动画&#xff0c;并且要求浏览器在下次重绘之前调用指定的回调函数更新动画。该方法需要传入一个回调函数作为参数&#xff0c;该回调函数会在浏览器下一次重绘之前执行。 备注&#xff1a; 若你想在浏览器下次重绘…

华为涅槃,余承东重生

最近一段时间&#xff0c;余承东甚为低调。最为明显的是&#xff0c;“遥遥领先”已经听不到了&#xff0c;“余大嘴”口中的措辞越来越克制。 今后手机相关的发布会&#xff0c;或许不再看到余承东的身影。 5月10日&#xff0c;余承东的职位正式更新&#xff0c;从终端BG CE…

ICode国际青少年编程竞赛- Python-4级训练场-复杂嵌套for循环

ICode国际青少年编程竞赛- Python-4级训练场-复杂嵌套for循环 1、 for i in range(4):Dev.step(i6)for j in range(3):Dev.turnLeft()Dev.step(2)2、 for i in range(4):Dev.step(i3)for j in range(4):Dev.step(2)Dev.turnRight()Dev.step(-i-3)Dev.turnRight()3、 for i …

LangChain 核心模块学习 模型输入 Prompts

模型输入 Prompts 一个语言模型的提示是用户提供的一组指令或输入&#xff0c;用于引导模型的响应&#xff0c;帮助它理解上下文并生成相关和连贯的基于语言的输出&#xff0c;例如回答问题、完成句子或进行对话。 提示模板&#xff08;Prompt Templates&#xff09;&#xf…

高清SDI串行数字接口采集卡与传输编码器

随着科技的快速发展&#xff0c;我们正处于一个数字化、信息化的时代&#xff0c;各式各样的设备正成为人们工作和生活中必不可少的伙伴。今天&#xff0c;我要向大家介绍的是一款具有革命性意义的视频采集卡——LCC262。这款由灵卡技术团队精心打造的产品&#xff0c;集合了多…

OrangePi Zero2 全志H616开发学习文档、基础IO蜂鸣器、超声波测距、舵机PWM基础开发

一.平台介绍 OrangePi开发板不仅仅是一款消费品&#xff0c;同时也是给任何想用技术来进行创作创新的人设计的。它是一款简单、有趣、实用的工具&#xff0c;你可以用它去打造你身边的世界。 特性 CPU 全志H616四核64位1.5GHz高性能Cortex-A53处理器GPU MaliG31MP2 Supports…

解决Vue devtools插件数据变化不会自动刷新

我们使用devtools插件在监测vuex中表单或自定义组件的数据&#xff0c;发现页面数据发生变化后&#xff0c;但是devtools中还是老数据&#xff0c;必须手动点击devtools刷新才能拿到最新的数据。很烦&#xff01; 解决方案&#xff1a; 打开chrome的设置&#xff0c;向下翻&…

设计模式 六大原则之里氏替换原则

文章目录 概念替换逻辑行为不变 拆解小结 概念 子类对象能够替换程序中父类对象出现的任何地方&#xff0c;并且保证原来程序的逻辑行为不变及正确性不被破坏。 替换 替换的前提是面向对象语言所支持的多态特性&#xff0c;同一个行为具有多个不同表现形式或形态的能力。 逻…

物联网应用开发--STM32与新大陆云平台通信(云平台控制开发板上蜂鸣器、LED)

实现目标 1、掌握云平台执行器的创建 2、熟悉STM32 与ESP8266模块之间的通信 3、具体实现目标&#xff1a;&#xff08;1&#xff09;创建5个执行器&#xff1a;蜂鸣器&#xff0c;LED1&#xff0c;LED2&#xff0c;ED3&#xff0c;LED4;&#xff08;2&#xff09;执行器能对…

SpringCloud2024最新版链路追踪教程micrometer+zipkin

本文基于B站尚硅谷2024版springcloud教学视频&#xff0c;主要用于自己学习记录以及分享技术&#xff0c;侵权私删 自己本机环境信息&#xff1a; jdk&#xff1a;17.0.10springboot&#xff1a;3.2.0springcloud&#xff1a;2023.0.0 micrometer 之前行业内使用的分布式链路…

tomcat--目录结构和文件组成

目录结构 目录说明bin服务启动&#xff0c;停止等相关程序和文件conf配置文件lib库目录logs日志记录webapps应用程序&#xff0c;应用部署目录workjsp编译后的结果文件&#xff0c;建议提前预热访问 /usr/local/apache-tomcat-8.5.100/work/Catalina/localhost/ROOT/org/apac…

《四》系统模块整体功能关联与实现

在上一篇里&#xff0c;我们完成了动作的创建&#xff0c;那么这一次&#xff0c;我们把它加载到界面上&#xff0c;把需要是实现的动作都加上。 MyWord::MyWord(QWidget *parent): QMainWindow(parent) {mdiAreanew QMdiArea;mdiArea->setHorizontalScrollBarPolicy(Qt::S…