（2）图片

建立一个ImageView控件来写标题。先将图片复制到res/drawable目录下，然后通过 app :srcCompat ="@drawable/sysu "来引用。

实验对图片的要求如下：

1 图片与标题的间距为 20dp （先将图片顶部与标题底部对齐，再设置20dp的间距）

2 居中 （与父容器左右都对齐后即可，就不再放代码了）

实现效果如下：

（3）输入框

先建立两个TextView控件，用来写“学号”和“密码”。“学号”（user_id）控件放在距离图片20dp，与屏幕左边也距离20dp。

“密码”（user_pwd）控件放在user_id下方20dp处，用以实现上下两栏间距 20dp。

接着设置建立两个EditView控件，用来输入学号和密码。

输入学号的控件布局设置如下：

由上面代码可知道，我们将其放在user_id控件右边，同时距离屏幕右边20dp。但是下划线长度一直保持跟hint字数长短一致，查阅资料后，将layout_width的属性由wrap_content改为fill_parent才使得下划线由下图左的状态变为下图右。

输入密码的控件布局设置如法炮制即可。

同时注意以下两点：

1 学号对应的 EditText 只能输入数字：android:digits="0123456789"

2 密码对应的 EditText 输入方式为密码：android:password="true"

3 下划线上面固定的字体应这样设置：android:hint="请输入学号（密码）"

实现效果如下：

（4）单选按钮

由于是单选按钮，所以我们先建立一个RadioGroup，之后再在里面建立两个单选按钮RadioButton。先让RadioGroup与容器左右都对齐，这样能实现两个单选按钮整体居中。对第2个按钮设置android:layout_marginLeft="10dp"，使得两个按钮间距10dp。因为要求默认选中的按钮为第一个，所以对第一个按钮设置android:checked="true"

实现效果如下：

（5）按钮

因为我无法实现两个按钮整体居中（也许可以通过数值坐标设定使得看起来“居中”，但是不够准确...），于是我先设置了一个id为“button_box”的View控件并使其居中，然后再将两个按钮放入其中。View的布局就是将其放在RadioGroup下方20dp处并居中，代码便不放了。

接下来就是建立两个Button控件，将第一个button与View左上对齐，第二个button设置其左边与第一个button右边距离10dp，从而实现按钮间的间距为10dp。

实验要求“按钮背景框左右边框与文字间距 10dp，上下边框与文字间距 5dp，圆角半径 10dp，背景色为#3F51B5”，本来是想在button控件下直接设置的，但是无法实现。后来查阅资料后才找到以下的解决方法：

先是在res/drawable下新建一个shape.xml文件，在里面写上background属性设置：

然后返回activity_main.xml文件，在button控件下进行引用：

实现效果如下：

（这里的圆角框有点被虚线挡住）

（6）实验结果

在Android Studio的布局为图1。将app导入手机中运行结果如图2（手机截图）。

图1 图2

四、 实验思考及感想

1  在做实验之前，我并没有好好看下载包里的实验文档，只是粗略看了下实验要求便开始着手打代码。实验中途遇到了一些不了解的困难也都是自己手动搜索了蛮久才找到适合的解决方案，有点费时费力。后来实验做完了又浏览了下实验文档，才发现里面讲了很多关于布局和控件的知识点，如果早点看到就不用浪费自己那么多精力去搜索相应的知识点了。以后每次实验一定要先仔细看看实验文档，做好基础打底。另外，设置RadioButton时漏看了“默认第一个按钮已选中”这个要求，添加代码之后也得顺道把实验报告里相关截图重新改了，实在麻烦，以后须更加细心。

2  之前选修过web课程，在AS上进行控件布局时发现了其与网页CSS布局有很多相同之处，包括位置的约束、属性的设定。这使得我更容易去理解、学会UI布局。编程开发大抵都有相通之处吧。

最后放上代码。

activity_main.xml
<?xml version="1.0" encoding="utf-8"?> <android.support.constraint.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="com.example.yc.sysu.MainActivity"> <TextView android:id="@+id/title" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="中山大学学生信息系统" android:textSize="20sp" android:textColor="#000000" app:layout_constraintTop_toTopOf="parent" android:layout_marginTop="20dp" app:layout_constraintLeft_toLeftOf="parent" app:layout_constraintRight_toRightOf="parent"/> <ImageView android:id="@+id/icon" android:layout_width="104dp" android:layout_height="104dp" app:srcCompat="@drawable/sysu" app:layout_constraintTop_toBottomOf="@id/title" android:layout_marginTop="20dp" app:layout_constraintLeft_toLeftOf="parent" app:layout_constraintRight_toRightOf="parent" /> <TextView android:id="@+id/user_id" android:text="学号：" android:textColor="#000000" android:textSize="18sp" android:layout_width="wrap_content" android:layout_height="wrap_content" app:layout_constraintLeft_toLeftOf="parent" android:layout_marginLeft="20dp" app:layout_constraintTop_toBottomOf="@id/icon" android:layout_marginTop="20dp" /> <TextView android:id="@+id/user_pwd" android:text="密码：" android:textColor="#000000" android:textSize="18sp" android:layout_width="wrap_content" android:layout_height="wrap_content" app:layout_constraintLeft_toLeftOf="parent" android:layout_marginLeft="20dp" app:layout_constraintTop_toBottomOf="@id/user_id" android:layout_marginTop="20dp"/> <EditText android:id="@+id/text_userid" android:hint="请输入学号" android:textColor="#000000" android:textSize="18sp" android:paddingTop="0dp" android:digits="0123456789" android:layout_width="fill_parent" android:layout_height="wrap_content" app:layout_constraintTop_toTopOf="@id/user_id" app:layout_constraintLeft_toRightOf="@+id/user_id" app:layout_constraintRight_toRightOf="parent" android:layout_marginRight="20dp"/> <EditText android:id="@+id/text_userpwd" android:hint="请输入密码" android:textColor="#000000" android:textSize="18sp" android:password="true" android:paddingTop="0dp" android:layout_width="fill_parent" android:layout_height="wrap_content" app:layout_constraintTop_toTopOf="@id/user_pwd" app:layout_constraintLeft_toRightOf="@+id/user_pwd" app:layout_constraintRight_toRightOf="parent" android:layout_marginRight="20dp" /> <RadioGroup android:id="@+id/radioButton" android:orientation="horizontal" android:layout_width="wrap_content" android:layout_height="wrap_content" app:layout_constraintLeft_toLeftOf="parent" app:layout_constraintRight_toRightOf="parent" app:layout_constraintTop_toBottomOf="@id/user_pwd" android:layout_marginTop="30dp"> <RadioButton android:id="@+id/radioButton1" android:text="学生" android:textColor="#000000" android:textSize="18sp" android:checked="true" android:layout_width="wrap_content" android:layout_height="wrap_content"/> <RadioButton android:id="@+id/radioButton2" android:text="教职工" android:textColor="#000000" android:textSize="18sp" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_marginLeft="10dp"/> </RadioGroup> android:id="@+id/button_box" android:layout_height="50dp" android:layout_width="185dp" app:layout_constraintTop_toBottomOf="@id/radioButton" android:layout_marginTop="20dp" app:layout_constraintLeft_toLeftOf="parent" app:layout_constraintRight_toRightOf="parent"/> <Button android:id="@+id/button1" android:text="登录" android:textColor="#ffffff" android:background="@drawable/shape" android:textSize="18sp" android:layout_width="wrap_content" android:layout_height="wrap_content" app:layout_constraintLeft_toLeftOf="@id/button_box" app:layout_constraintTop_toTopOf="@id/button_box" /> <Button android:id="@+id/button2" android:text="注册" android:textColor="#ffffff" android:background="@drawable/shape" android:textSize="18sp" android:layout_width="wrap_content" android:layout_height="wrap_content" app:layout_constraintLeft_toRightOf="@id/button1" android:layout_marginLeft="10dp" app:layout_constraintTop_toTopOf="@id/button_box"/> </android.support.constraint.ConstraintLayout>

shape.xml

<?xml version="1.0" encoding="utf-8"?> <shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle"> <solid android:color="#3f51b5"/> <corners android:radius="10dip"/> <padding android:bottom="5dp" android:top="5dp" android:left="10dp" android:right="10dp"/> </shape> 使用 Android Studio 的强大功能，我们可以轻松创建出各种各样的精美界面，并为它们添加复杂的功能和效果，以满足用户的需求。在上述代码中，我们通过findViewById方法获取了按钮和EditText组件的引用，并将其与对应的布局文件中的ID进行关联。然后，我们为按钮设置了一个匿名的点击监听器，当用户点击按钮时，会触发其中的onClick方法。最后，通过点击 Android Studio 工具栏上的“运行”按钮，我们可以在模拟器或连接的真实设备上预览并测试应用程序的 UI界面 和功能。 Android 开发对于我来说是一种全新的体验，有了兴趣加持后更不觉得枯燥。在开发过程中遇到了很多问题，也一度想要放弃，但好在最后顺利完成，看到成果的一刻也是发自内心的开心。，通过一个一个困难的解决我也获得了成长。 恭喜你！现在你已经掌握了 Android UI开发的基础知识，包括各种布局类型、常用控件的使用以及一些UI优化技巧。这些知识将帮助你 设计 出既美观又实用的 Android 应用界面。 在Windows平台上开发客户端产品是一个非常痛苦的过程，特别是还要用C++的时候。尽管很多语言很多方法都可以开发Windows桌面程序，目前国内流行的客户端产品都是C++开发的，比如QQ，YY语音，迅雷等。快速，稳定是我认为的应用软件开发框架最 基本 的要求，对于UI还有两个要求就是界面美观，配置灵活。C++语言满足了快速的要求，传统的客户端软件开发框架如MFC... Android Studio 制作微信界面（一）实现目标实现微信底部导航栏功能：根据用户选择的选项切换不同的Fragment显示在FrameLayout中。每个选项对应一个Fragment，包括聊天界面、通讯录界面、发现界面和主页界面，并在界面中显示“这里是微信”，“这里是通讯录”等字样，底部按钮颜色，图片随之替换绿色。每个选项对应一个Fragment，包括聊天界面(FragChat)、通讯录界面(FragAddresslist)、发现界面(FragFind)和主页界面(FragHome)： 掌握UI 设计 中的layout布局（约束布局）与 基本 控件（button、text、imageview等）； 掌握复杂控件与adapter的使用。（请使用RecycleView进行 设计 ） 实验结果：（实验小结与结果截图） 功能说明与核心代码 总体功能：在消息页面实现recycleview并对消息进行分组和实现点击效果。 确认数据格式，新建一个JavaBean设置数据格式 public class MegList { //数据本身 private... btn_login.xml <?xml version="1.0" encoding="utf-8"?> <shape xmlns: android ="http://schemas. android .com/apk Material Design是由Google推出的一种 设计 语言，用于创建现代化、统一和美观的用户界面。它借鉴了纸张的物理特性，通过阴影、动画和色彩等元素，为用户呈现出一种立体的、更加真实的界面体验。Material Design的目标是提供一种一致性和直观性的 设计 语言，让用户能够更容易地理解和操作应用。 2 界面设计 Android 应用开发的一项重要内容就是界面开发。对于用户来说，不管APP包含的逻辑多么复杂，功能多么强大，如果没有提供友好的图形交互界面，将很难吸引最终用户。 2.1 UI 设计 概述 Android 系统按照MVC(模型(model)－视图(view)－控制器(controller)) 设计 模式将应用程序的 界面设计 与功能控制 设计 分离，类似于前后端分离，而在AS中，前端的界面布局文件是在生成的应用程序框架项目的res资源目录的layout子目录中。 res/layout目录下存放定义UI 设计 的XML文