草庐IT

AndroidStudio3.1 线性布局

A7@Eliauk 2023-04-05 原文

文章目录

一、学习目标

  • 了解界面与布局
  • 掌握线性布局
  • 理解线性布局嵌套

二、概括

安卓应用包含界面与功能两个方面,一个好的安卓应用,应该给用户提供良好的体验,其中界面设计至关重要,要设计界面,那就要求开发者熟练使用布局来摆放窗口里的不同组件。

三、讲解

(一)界面与布局

1、界面

  • 应用界面包含用户可查看并与之交互的所有内容。安卓提供丰富多样的预置 UI 组件,例如结构化布局对象和 UI 控件,您可以利用这些组件为您的应用构建图形界面。安卓还提供其他界面模块,用于构建特殊界面,例如对话框、通知和菜单。

2、布局

  • 布局可定义应用中的界面结构(例如 Activity 的界面结构)。布局中的所有元素均使用 View 和 ViewGroup 对象的层次结构进行构建。View 通常绘制用户可查看并进行交互的内容。然而,ViewGroup 是不可见容器,用于定义 View 和其他 ViewGroup 对象的布局结构。

(1)视图层次结构图

(2)UI容器 (Container)

  • UI容器指ViewGroup,也是View的子类,而ViewGroup有几个布局子类:LinearLayout、RelativeLayout、AbsoluteLayout、TableLayout、GridLayout,ConstraintLayout。

(3)UI控件 (Control)

  • UI控件指Widget(微件),不能再包含其它元素的控件,例如标签(TextView)、文本框(EditText)、按钮(Button)、 活动栏(Action Bar)、对话框(Dialogs)、状态栏(Status)、通知(Notifications)。
(4)两种方式声明布局
  • 在 XML 中声明界面元素:Android 提供对应 View 类及其子类的简明 XML 词汇,如用于微件和布局的词汇。也可使用 Android Studio 的 Layout Editor,并采用拖放界面来构建 XML 布局。
  • 在运行时实例化布局元素:应用可通过编程创建 View 对象和 ViewGroup 对象(并操纵其属性)。
package net.fzy.directui;

import androidx.appcompat.app.AppCompatActivity;

import android.app.ActionBar;
import android.os.Bundle;
import android.view.Gravity;
import android.view.View;
import android.widget.Button;
import android.widget.LinearLayout;
import android.widget.Toast;

public class MainActivity extends AppCompatActivity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        // 创建线性布局
        LinearLayout layout = new LinearLayout(this);
        // 设置布局参数(布局宽度和高度)
        layout.setLayoutParams(new LinearLayout.LayoutParams(
                LinearLayout.LayoutParams.MATCH_PARENT,
                LinearLayout.LayoutParams.MATCH_PARENT));
        // 设置布局对齐方式 - 居中对齐
        layout.setGravity(Gravity.CENTER);
        // 设置布局背景图片
        layout.setBackground(getResources().getDrawable(R.drawable.background));
        // 创建按钮对象
        Button btnWelcome = new Button(this);
        // 设置按钮文本
        btnWelcome.setText("欢迎");
        // 添加按钮到布局里
        layout.addView(btnWelcome);
        // 设置内容视图,将布局作为用户界面
        setContentView(layout);
        // 给【欢迎】按钮注册单击监听器,实现监听器接口,编写事件处理方法
        btnWelcome.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {
                Toast.makeText(MainActivity.this, "欢迎访问泸州职业技术学院", Toast.LENGTH_LONG).show();
            }
        });
    }
}
  • 借助 Android 框架,您可以灵活选择使用两种或其中一种方法来构建应用界面。例如,您可以在 XML 中声明应用的默认布局,然后在运行时修改布局。

(二)线性布局

  • 线性布局(LinearLayout)是一种比较常用且简单的布局方式。在这种布局中,所有的子元素都是按照垂直或水平的顺序排列在界面上。如果是垂直排列,每个子元素占一行,如果是水平排列,则每个子元素占一列。线性布局可以支持布局样式嵌套实现复杂的布局样式。

1、继承关系图

  • LinearLayout是ViewGroup的子类,注意:后面我们要学习的单选按钮组(RadioGroup)是线性布局的子类

2、常用属性

属性含义
layout_height高度,单位:dp (wrap_content, match_parent)
layout_weight宽度,单位:dp (wrap_content, match_parent)
orietation方向(vertical,horizontal)
gravity对齐方式(left, right, center, top, bottom…)
background背景(颜色[color]、图片[drawable]、选择器[selector])
weight比重(用于瓜分手机屏幕)
padding内边距 (paddingLeft, paddingRight, paddingTop, paddingBottom)
margin外边距 (marginLeft, marginRight, marginTop, marginBottom)

(三)案例演示:线性布局属性

1、创建安卓应用

  • 基于Empty Activity模板创建安卓应用 - LinearLayoutDemo
  • 单击【Finish】按钮

2、主布局资源文件

  • 主布局资源文件 activity_main.xml
  • 将约束布局改为线性布局,删掉默认的标签
  • 添加两个按钮

3、字符串资源文件

  • 字符串资源文件 - strings.xml

4、启动应用,查看效果

  • 发现两个按钮水平摆放,在窗口左上角

5、设置布局属性,查看效果

(1)设置线性布局方向

  • orientation属性

(2)设置线性布局内边距

  • padding (paddingTop, paddingBottom, paddingLeft, paddingRight)

(3)设置线性布局对齐方式

  • gravity (left、center、right、top、bottom可以搭配形成很多种对齐方式)
  • 设置右上对齐 - right|top
  • 删掉【按钮1】的右外边距
  • 设置居中对齐 - center
  • 设置左下对齐 - left|bottom
  • 设置右下对齐 - right|bottom
  • 设置上中对齐 - center
  • 其余几种情况:左中对齐、右中对齐和下中对齐,大家自己玩一玩

(4)设置线性布局背景

  • 设置背景颜色(采用颜色变量)

  • 设置背景颜色(采用颜色常量)

  • 问题:想设置自己喜欢的颜色,怎么定义颜色常量?

  • https://m.wang1314.com/doc/webapp/topic/21084865.html

  • 设置背景图片

  • 设置背景选择器

  • 添加一个线性布局,设置自定义边框

  • 实现边框渐变色效果

(四)案例演示:线性布局嵌套

1、创建安卓应用

  • 基于Empty Activity创建安卓应用 - NestedLinearLayout
  • 单击【Finish】按钮

2、准备图片素材

  • 将三张小图片拷贝到res/drawable目录

3、主布局资源文件

  • 主布局资源文件 - activity_main.xml
  • 将约束布局改为线性布局
  • 添加三个线性布局,按照1:2:3比例垂直瓜分手机屏幕

4、字符串资源文件

  • 字符串资源文件 - strings.xml

5、启动应用,查看效果

  • 三个布局按照1:2:3比例垂直瓜分手机屏幕

6、修改布局,查看效果

  • 在第一个布局添加三个水平摆放的图像视图
  • 在第二个布局里添加一个横向线性布局,里面添加四个按钮
  • 在第二个布局里添加一个编辑框
  • 第三个布局里添加三个布局,按照1:2:3比例水平瓜分手机屏幕

有关AndroidStudio3.1 线性布局的更多相关文章

  1. ruby - nanoc 和多种布局 - 2

    是否可以为特定(或所有)项目使用多个布局?例如,我有几个项目,我想对其应用两种不同的布局。一个是绿色的,一个是蓝色的(但是)。我想将它们编译到我的输出目录中的两个不同文件夹中(例如v1和v2)。我一直在玩弄规则和编译block,但我不知道这是怎么回事。因为,每个项目在编译过程中只编译一次,我不能告诉nanoc第一次用layout1编译,第二次用layout2编译。我试过这样的东西,但它导致输出文件损坏。compile'*'doifitem.binary?#don’tfilterbinaryitemselsefilter:erblayout'layout1'layout'layout2'

  2. ruby-on-rails - 我可以在没有 Controller 的情况下直接从 routes.rb 渲染布局吗? - 2

    我想为网站的管理和公共(public)部分设置一对样式指南。每个都需要自己的布局,其中包含静态html和调用erbpartials的混合(因此静态页面不会削减它)。我不需要Controller来为这些页面提供服务,而且我不希望有效的仅开发内容使其余代码困惑。这让我想知道是否有一种方法可以直接呈现布局。免责声明:我明白这不是我应该经常/永远做的事情,而且我知道有很多争论可以解释为什么这是一个坏主意。我对这是否可能感兴趣。有没有办法让我直接从routes.rb渲染布局而不通过Controller? 最佳答案 出于某种奇怪的原因,我想暂时

  3. ruby-on-rails - 设计 Controller 如何改变布局? - 2

    这个问题在这里已经有了答案:differentlayoutforsign_inactionindevise(8个答案)关闭7年前。如何更改设计Controller中的布局?

  4. 线性代数让我想想:快速求三阶矩阵的逆矩阵 - 2

    快速求三阶矩阵的逆矩阵前言一般情况下,我们求解伴随矩阵是要注意符号问题和位置问题的(如下所示)A−1=1[  ][−[  ]−[  ]−[  ]  −[  ]]=A−1=1[  ][   M11−[M12]   M13−[M21]   M22−[M23]     M31−[M32]   M33]⊤\begin{aligned}&A^{-1}=\frac{1}{[\\]}\left[\begin{array}{cccccc}&-[\\]&\\-[\\]&&-[\\]\\\\&-[\\]&\\\end{array}\right]=\\\\&A^{-1}=\frac{1}{[\\]}\left[\b

  5. ruby-on-rails - Rails - 如何在布局中查找域 url - 2

    我有request.env['http_host']在本地主机上工作,但在heroku的布局页面中引用时会导致错误。此请求在View中工作并显示正确的基本url,但是当我将代码移动到布局时它会导致错误。注意-我正在使用它来为html电子邮件中的图像构建绝对url。收到错误:ActionView::Template::Error(undefinedmethod`env'fornil:NilClass): 最佳答案 如果你想要没有端口的主机,只需使用:request.host编辑:糟糕,我刚刚注意到您正在使用View中的代码。我不知道它

  6. Ruby GUI(非复杂布局) - 2

    我对RubyGUI设计做了很多研究,这似乎是Ruby倾向于落后的领域。我探索了MonkeyBars、wxRuby、fxRuby、Shoes等选项,只是想从Ruby社区获得一些意见。虽然它们绝对可用,但每一个的开发似乎都在下降。我在任何(减去fxRuby书)上都找不到大量有用的文档或用户基础。我只是想制作一个简单的GUI,所以我真的不想花费数百小时来学习更复杂的工具的复杂性或尝试使用甚至不再开发的东西(鞋子是应用程序的类型我正在寻找,但它有很多问题并且没有得到积极开发。)在所有选项中,你们会推荐哪个选项是最快的,并且仍然具有某种开发基础?谢谢! 最佳答案

  7. ruby - Rails 渲染 Controller 中的部分和布局 - 2

    我正在覆盖设计注册Controller的创建操作。我有两种注册表格,个人或公司,公司有一个名为company_form的字段设置为true以区分这两种表格。在表单验证后,我希望呈现正确的表单(以前无论我使用什么表单,它都会返回默认表单)。我遇到了一个问题,即只渲染了部分(很明显,因为我只渲染了部分),但我还需要渲染布局/应用程序文件。classRegistrationsControllerifresource.company_formrenderpartial:'shared/company_signup_form'elserenderpartial:'/shared/individu

  8. ruby-on-rails - 缺少带有 { :locale=>[:en], :formats=>[:html], 的模板布局/邮件程序 - 2

    我正在学习michaelharltrails教程,但出现此错误Missingtemplatelayouts/mailerwith{:locale=>[:en],:formats=>[:html],:variants=>[],:handlers=>[:raw,:erb,:html,:builder,:ruby,:coffee,:jbuilder]}.Searchedin:*"/home/ubuntu/workspace/app/views"预览账户激活时这是我的user_mailer.rbclassUserMailer错误突出显示了mailto:user.email,subject:"A

  9. ruby - Sinatra 中的嵌套布局 - 2

    tl;dr:在Sinatra中是否有一种干净的嵌套布局方式?对于我网站上的所有页面,我有一个通用的layout.erb,它呈现页眉、页脚和其他一些位。对于这些页面的一个子集,我想使用内部布局,除了那些公共(public)位之外,它还呈现左侧菜单。全局erb:pageTemplate执行layout.erb,其中yield执行pageTemplate在子集中erb:pageTemplate执行layout.erb,其中yield执行specificLayout.erb,其中yield执行pageTemplate。有道理吗?我对单独的类、before语句和任何其他ruby​​魔法持开放态度

  10. ruby-on-rails - 在 Rails 中是否可以动态加载类布局? - 2

    我需要消息在项目中有不同的布局,是否可以在Rails中做这样的事情?ClassMessages::New谢谢 最佳答案 这对你有帮助classMessagesController 关于ruby-on-rails-在Rails中是否可以动态加载类布局?,我们在StackOverflow上找到一个类似的问题: https://stackoverflow.com/questions/1274999/

随机推荐