Android开发者必须要了解的View布局过程(View的工作之Layout过程)

View的工作原理之layout过程

目录

  • 1. 详细布局过程
    • 1.1 布局过程到底要做什么?
    • 1.2 布局相关的属性Frame
  • 2. 自定义onLayout,简单实现FloatingButton
    • 2.1 效果图
    • 2.2 avtivity.xml
    • 2.3 CustomFloatingView.java

1. 详细布局过程

Android开发者必须要了解的View布局过程(View的工作之Layout过程)_第1张图片

1.1 布局过程到底要做什么?

  1. 确定View的位置
  2. 如果是ViewGroup,则回调子节点布局过程

只有布局过程执行完毕,获取View的宽高才是准确的

1.2 布局相关的属性Frame

布局过程需要确定出View的位置与宽高属性,那么整个这些属性通过Frame来描述。

一个View(ViewGroup)的宽高和位置信息到底是怎么描述的呢?在Android的位置系统中,通过Frame来表示:

Android开发者必须要了解的View布局过程(View的工作之Layout过程)_第2张图片

也就是说,一个Frame包含了四个对应的属性:

left (mLeft)
top (mTop)
right (mRight)
bottom (mBottom)

根据这四个属性,就可以确定出View的位置信息与View的宽高信息。

view的高 = bottom - top
view的宽 = right - left
view的位置 = (left, top)

View中上面的说到的属性都是hide标记的,也就是说子类是看不到的,那么如何获取这些值呢?

view.getLeft();
view.getTop();
view.getRight();
view.getBottom();
// 注意以下值是以px为单位的,如果设置的是dp,需要作出转换。
view.setLeft(xxx);
view.setTop(xxx);
view.setRight(xxx);
view.setBottom(xxx);

2. 自定义onLayout,简单实现FloatingButton

此为简易版,仅仅是为了探讨layout过程的,最好不要用于实际开发。

实现原理:

onLayout时,将View的位置固定在一个固定的位置,不随布局改变而改变

2.1 效果图

Android开发者必须要了解的View布局过程(View的工作之Layout过程)_第3张图片

2.2 avtivity.xml


<LinearLayout 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"
    android:orientation="vertical"
    tools:context="com.ung8023.androidbase.view.define.LayoutActivity">

    <TextView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_margin="10dp"
        android:background="@color/colorPrimary"
        />

    <com.ung8023.androidbase.view.define.CustomFloatingView
        android:layout_width="100dp"
        android:layout_height="100dp"
        android:layout_marginLeft="20dp"
        android:background="@color/colorAccent"
        />

LinearLayout>

2.3 CustomFloatingView.java

public class CustomFloatingView extends View {
    public CustomFloatingView(Context context) {
        super(context);
    }

    public CustomFloatingView(Context context, @Nullable AttributeSet attrs) {
        super(context, attrs);
    }

    public CustomFloatingView(Context context, @Nullable AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);
    }

    @Override
    protected void onLayout(boolean changed, int left, int top, int right, int bottom) {
        int width = getWidth();
        int height = getHeight();
        ViewGroup.MarginLayoutParams layoutParams = (ViewGroup.MarginLayoutParams) getLayoutParams();
        setLeft(layoutParams.leftMargin);
        setTop(400);
        setRight(width + layoutParams.leftMargin);
        setBottom(400 + layoutParams.topMargin + height);
    }
}



我的个人网站

  • Android模块
  • 开发知识分享

推荐视频教程:

Android从整体到局部系列视频教程戳我

广告:

我使用的装备:程序员必备 | 不伤关节 | 手感好 | 静电容 | Plum键盘|Niz键盘 戳我



你可能感兴趣的:(Android开发系列)