Android个性名片界面的设计——约束布局的应用

news/2024/9/28 22:57:46 标签: android, 前端, javascript

节选自《Android应用开发项目式教程》,机械工业出版社,2024年7月出版
做最简单的安卓入门教程,手把手视频、代码、答疑全配齐

【任务目标】
使用约束布局、TextView控件实现一个个性名片界面的设计,界面如图1所示。
在这里插入图片描述
图1 个性名片界面图
【任务分析】
上述界面可以使用约束布局、线性布局、表格布局来实现,使用约束布局实现较为灵活方便,这里可以采用约束布局中的辅助线,将界面分解为10个区域,再对每个区域中的TextView控件设置约束。
信息安全和隐私保护是每个人都应该关注的重要问题。我们应该加强自我保护意识。不要轻易上传个人信息,尤其是在陌生的平台或网站。此外,我们还应该注意分享信息时的安全问题。本项目开发的个性名片要注意保护个人隐私,不要轻易上传个人信息或分享给陌生人。总之,保护自己的信息安全和隐私是一项长期而艰巨的任务。我们需要时刻保持警惕,采取必要的措施来保护自己的隐私和信息安全。
【任务实施】
1.新建工程项目CallingCard(参考项目1)
2.修改页面布局文件activity_main.xml
1)默认打开的activity_main.xml,如图所示。首先选中“Hello World!”TextView控件,单击Delete键将其删掉。
2)将Plalette区的TextView控件拖到设计预览区,连续拖8个TextView到该区域。
在这里插入图片描述

图2 个性名片步骤2

3)选中一个TextView控件,单击侧边栏的Attributes,打开Attributes窗口,将被选中控件的text属性值修改为“姓名”,其他TextView控件依此类推。
在这里插入图片描述
图3 修改text属性
4)选中界面中所有的TextView控件,单击Attributes窗口的搜索框,搜索“text”属性,整体修改TextView控件的字体大小为20sp,颜色为#3F51B5,修改完后,界面如图4所示。
在这里插入图片描述

图4 修改textSize和textColor属性
5)添加4根横向辅助线,1根纵向辅助线,横向辅助线位置分别为界面垂直方向的15%、30%、45%、60%处,纵向辅助线为界面水平方向的35%,将整个界面分成10个区域,如图5所示。
在这里插入图片描述

图5 添加水平辅助线

6)接着添加TextView控件的位置约束,将其分布在界面上方的8个区域中心,如图所示。首先确定姓名TextView控件的位置,如图6所示。其他TextView控件的位置可以使用相同的方法确定约束,也可以使用对齐工具 中的 来确定位置。
在这里插入图片描述
图6 添加控件约束
7)所有TextView控件的位置约束添加完成后,如图7所示。
在这里插入图片描述
图7 约束完成图

8)运行此App,如无错误则完成此项目。如有错误,可以查看所有控件位置是否完全确定,如果不完全确定,Component Tree区会出现错误提示,如图8所示。
在这里插入图片描述

图8 约束布局错误提示
编译运行应用,效果如图9所示。
在这里插入图片描述

图9 个性名片运行效果图

2.4.1Android安卓开发之个性名片界面的设计约束布局实操ConstraintLayout

更多内容见《Android应用开发项目式教程》,做最简单的安卓入门教程,手把手视频、代码、答疑全配齐
在这里插入图片描述


http://www.niftyadmin.cn/n/5682010.html

相关文章

C语言 | Leetcode C语言题解之第435题无重叠区间

题目: 题解: int cmp(int** a, int** b) {return (*a)[1] - (*b)[1]; }int eraseOverlapIntervals(int** intervals, int intervalsSize, int* intervalsColSize) {if (intervalsSize 0) {return 0;}qsort(intervals, intervalsSize, sizeof(int*), cm…

3.整数二分

模板 package base;public class Bsearch {public int binary_search1(int l, int r){while (l<r){int mid (lr1)>>1;if(check(mid)) lmid;else r mid-1;}return l;}public int binary_search2(int l, int r){while (l<r){int mid (lr)>>1;if (check(mid…

【英特尔IA-32架构软件开发者开发手册第3卷:系统编程指南】2001年版翻译,1-1

文件下载与邀请翻译者 学习英特尔开发手册&#xff0c;最好手里这个手册文件。原版是PDF文件。点击下方链接了解下载方法。 讲解下载英特尔开发手册的文章 翻译英特尔开发手册&#xff0c;会是一件耗时费力的工作。如果有愿意和我一起来做这件事的&#xff0c;那么&#xff…

windows的pycharm直接连接linux项目敲代码,我现在强的可怕,使用PyCharm Professional版的远程开发功能

使用PyCharm Professional版的远程开发功能&#xff0c;可以在本地机器上运行PyCharm的图形用户界面&#xff08;GUI&#xff09;&#xff0c;同时将代码的执行、调试等任务委托给远程服务器。这种方式不需要在服务器上安装图形界面&#xff0c;但需要一些配置来设置服务器上的…

Python实现Phong着色模型算法

目录 使用Python实现Phong着色模型算法引言Phong着色模型的基本原理1. 模型组成2. 公式 Phong着色模型的Python实现1. 向量类的实现2. 光源类的实现3. 材质类的实现4. Phong着色器类的实现 整体实现总结 使用Python实现Phong着色模型算法 引言 在计算机图形学中&#xff0c;光…

GitLab CI/CD脚本入门

工作中第一次用到gitlab自带的cicd&#xff0c; 记录一下备忘 GitLab CI/CD 配置文件 (.gitlab-ci.yml) 中有许多关键字&#xff0c;用于定义不同的行为和阶段。以下是一些常见且重要的关键字&#xff1a; 全局和 job 特定关键字 image 指定运行 CI job 时的 Docker 镜像。 im…

开源模型应用落地-qwen2.5-7b-instruct-LoRA微调-LLaMA-Factory-单机单卡-V100(十八)

一、前言 本篇文章将使用LLaMA-Factory去高效微调(命令和界面方式)QWen2.5系列模型,通过阅读本文,您将能够更好地掌握这些关键技术,理解其中的关键技术要点,并应用于自己的项目中。 QWen2系列模型微调: 开源模型应用落地-qwen2-7b-instruct-LoRA微调-LLaMA-Factory-单机单…

C++ | Leetcode C++题解之第435题无重叠区间

题目&#xff1a; 题解&#xff1a; class Solution { public:int eraseOverlapIntervals(vector<vector<int>>& intervals) {if (intervals.empty()) {return 0;}sort(intervals.begin(), intervals.end(), [](const auto& u, const auto& v) {retur…