android 移动应用与开发_android移动应用开发-CSDN博客

本文链接：https://blog.csdn.net/2203_75291754/article/details/142578487

1.初识android studio

相信大家已经安装好android studio这一工具，并将其环境配置也完成了，今天我来交大家使用android studio这一工具，来帮助我们完成安卓的设计

首先，在进入软件后，我们需要观察页面布局，可以看到，android studio 的页面布局与Eclipse的布局极度相似，这里我们就不过多的赘述。

打开软件后在左侧的文件夹管理中，找到“ MainActivity ”这个文件，这个文件非常重要，是贯穿我们实现的重要运行文件，它一般出现在 Java → com.example.myapplication 里（如下图1.1）

图1.1

在这个文件里一般会有代码：

package com.example.myapplication;

import androidx.appcompat.app.AppCompatActivity;

import android.os.Bundle;

public class MainActivity extends AppCompatActivity {



    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
    }

}

这个代码是用来运行你设计的前端效果显现在模拟手机上的效果，要想看到模拟效果，你还要选择“手机”，如图1.2，在右上角选择AVD，点击“ create virtual devices ” 增加虚拟手机，如图1.4，选择想要实现的虚拟手机，然后就点击“ next ”完成下载，之后的设计运行就会由下载的这个虚拟手机来展现出来

图1.2

图1.3

图1.4

当我们运行起来后，就会如图1.5一样，图1.5所展示的是 Pixel 3a XL API 30 模拟机，右侧的按键可以对模拟手机处理，可以模拟这个手机的“息屏”“声音大小”“放大”“手机旋转”等调整

图1.5

接下来就到了我们对安卓页面设计的时候了，如图1.6所示，我们需要对“drawable”和“layout”这两个文件夹进行操作，我们一般在“drawable”文件夹中使用“小窗拖拽”的方式添加我们需要用到的图片素材；在“layout”文件夹中设计我们需要实现的页面。

图1.6

2.制作 button

如图2.1所示，我们需要右键单击“layout”文件夹，选择 new → XML → layout XML File 新建一个设计的文件，如图2.2所示，我们需要将布局文件类型填写为 LinearLayout，布局文件名可自定义（如图2.2所示，将示例文件命名为 activity_second）

图2.1

图2.2

聚焦于文件右上角，找到design 字样，便打开了设计面板，如图2.3所示，再次点击可以隐藏设计面板，其他按钮也可以实现按一次出现，再次点击就隐藏的效果，而design面板可以对选中的对象进行调整，无论对颜色、大小对齐方式等都可以调整，不过要先点击需要调整的对象。

图2.3

如图2.4所示，找到 palette ，点击后里边有各种组件，找到 common中的button，点击后将其拖拽到白色面板上，如图中红色箭头所示，此时完成对面板上的“添加组件”的工作（这里相当于在设计面板上添加了一个button组件，图片中所显示的为添加5个button组件后并调整后的照片）

图2.4

如图2.5所示，我们需要拖拽5个button组件，拖拽后的效果如图所示。

图2.5

点击所添加的任意组件都可以达到“选择”的效果，如果不先点击对应对象就无法做出调整，我们要先点击白色面板，注意不要点击任何插件，之后如图2.6所示，找到 Common Attributes 点击 orientation 的下拉菜单，选择 verticcl 这个可以调整页面布局的方向，此时，我们已经把页面默认的横向布局调整为了竖向布局

图2.6

接下来，我们要对添加的 button 组件进行调整，首先如图2.7所示，我们先点击一个button组件，找到其对应的右侧设计面板；如绿色选框所示，找到 Declared Attributes 中的 layout_width 更改选中对象的宽度，下拉菜单中可以选择wrap_content来自行调整（个人理解，如有不当欢迎指正）也可选择match_parent来自动适应页面画布的布局， layout_hight可以调整对象高度，使用同理，也可以直接改变选框内容来改变对象的长度和宽度，需要在输入的数字后加上“dp”（这里的dp相当于一个单位，如果不添加则无法被识别，调整不了）在text中的框内可以写任何符号、字母或数字，这些都可以出现在button插件的表面，方便我们设计，在Common Attributes找到background，通过这个来调整插件的颜色，经过调整就如图2.8所示，（注意：选中画布的layout_width和layout_hight必须选择为wrap_content）

PS：调整时也可以直接拖动选中对象的蓝色选框，在画布上手动调整。

图2.7

图2.8

如图2.9所示，最后打开MainActivity文件，找到红框所选区域把名称更换成新建文件夹的文件名并点击右上方的运行按钮（此过程和新建文件夹过程在后续的教程中就不过多赘述）

图2.9

3.插入图片

如2.制作button中的创建新文件，使用小窗拖拽到drawable文件夹或点击drawable文件夹后使用Ctrl C +Ctrl V 的方式添加图片都可以，添加完成后在palette中找到text拖动两个TextView到画布中，在右侧的design中搜索foreground，点击“图片”的矢量图，找到上传的图片并应用，如图3.3所示找到foregroundGravity，并勾选对应的选项，调整图片位置