实现简单的android UI界面

时间:2022-02-06 00:02:48

实现内容

实现简单的android UI界面
一共可以分为五部分,分别如下:
标题:
实现简单的android UI界面
图片:
实现简单的android UI界面
输入界面:
实现简单的android UI界面
选择button:
实现简单的android UI界面
登录注册框:
实现简单的android UI界面

XML布局

1、 标题:
实现简单的android UI界面
这里我们进行的是标题的编写,我们看到的是,首先需要水平居中,然后是对于控件的间距和字体的大小需要进行调整,最后,保证字体颜色为黑色(#000000),这里我们利用了style的资源,所以,就可以进行简单的封装。
2、 图片:
实现简单的android UI界面
我们看到这里面,需要注意修改的就是图片的路径,所以,我们需要进行的是路径的修改和图片的添加,就可以了。
3、 输入界面:
这里运用了布局,我们运用的是gridlayout,所以,我们需要注意的是布局的调整,我们需要做的是对其,可以采用中轴线对其,利用如下代码就可以完成了:
实现简单的android UI界面
采用上面的代码,我们就可以实现右对齐以及上面控件的间距了。
当然,由于我们的控件的位置使在图片的下方,所以,我们需要在gridlayout中加入这句话,以保证我们的位置布局是正确的:
实现简单的android UI界面
4、 选择button:
这里的选择按钮,其实需要我们进行的是一个单选操作,所以,我们利用RadioGroup
实现简单的android UI界面
我们在这里,可以设定好间距,居中方式,然后进行实验,就OK了。
在第一个button出选择true,这样就是被选中了:
实现简单的android UI界面
5、 登录注册框:
这里我们还是用了一个linearlayout:
实现简单的android UI界面
我们还是需要先进行的是居中处理,这样的话,我们就可以很好的完成对应的处理,然后,这里的话,我们需要做的其实就是圆角矩形的操作,我们看到的是,这里需要自己设定一个图形,调整shape:
实现简单的android UI界面
这样的话,我们可以调整背景色,圆角半径,字与框的距离,通过这些设定之后,我们只需要在后面的实验中进行调用就可以了:
实现简单的android UI界面
这样的话,我们就可以完成这次的实验了,同样注意和上下控件的间距,就可以完成了。
在这次的试验中,我们利用了四种资源,分别是style,color,string,dimen,所以,我们可以很好的完成封装:
Style:
实现简单的android UI界面
Dimen:
实现简单的android UI界面
String:
实现简单的android UI界面
Color:

实现结果

实现简单的android UI界面