This article has participated in the third “topic writing” track of the Denver Creators Training Camp. For details, check out: Digg Project | Creators Training Camp third is ongoing, “write” to make a personal impact.
๐ About the author
As we all know, life is a long process of constantly overcoming difficulties and reflecting on progress. In this process, there will be a lot of questions and thoughts about life, so I decided to share my thoughts, experiences and stories to find resonance!! Focus on Android/Unity and a variety of game development skills, as well as a variety of resources to share (website, tools, materials, source code, games, etc.) welcome to pay attention to the public account [Mr. Blank] for more resources and communication!
๐ about to learn
Learn about the Android Studio layout editor.
๐ background
The UI code in the development phase does not require much technical content, but it has a significant amount of work. If you want to develop a layout interface quickly, you must be proficient in using the layout editor. Android Studio not only provides a great form of layout editing, but also displays a preview interface in real time.
So today we are going to go over the Studio editor again in detail, in order to quickly build the APP interface using UI components.
๐ Practice
๐ Editor introduction
Oh, damn high sense!!
No matter how many times I open it, I always feel that the interface is beautiful, and writing code in this case is also a kind of comfort.
- Basically contains all UI components that can be dragged and dropped directly into the layout
- The hierarchy of the current layout
- You can change the layout/change the theme/change the preview device etc
- Preview of the current interface, you can drag and drop the UI directly inside
- Is the layout editor in code mode or design mode
- The base user property of the currently selected UI control
๐ Create and transform layouts
Select the Layout folder under RES and right-click new-Layout Resource File to create a New layout File
Then add images and text to the layout
ConstraintLayout is the default root layout when creating the layout. We’ll test the conversion so use the LinearLayout as the default root layout.
Switch to Design mode – right-click Component Tree- select Convert… To ConstraintLayout, as shown below:
The transformed code is shown below:
And the initial layout writing form has changed a lot. So why are we turning around?
- ConstraintLayout is created by default when an old project is updated to a new one.
- ConstraintLayout is now recommended because of its adaptive, constraint-based layout system.
- This conversion is not 100% appropriate, and the layout of the conversion can be messy.
๐ Quick search
Design interface to support quick search of attributes:
๐ Quickly set font styles
- On the Design screen, select a TextView
- Find TextAppearance-FontFamily in Attributes
- Open the list, find More, and select the appropriate font. The download mode or package mode will be displayed on the right side. Select one and click OK
๐ Visual property manipulation
Android development today doesn’t need to write code to figure out the layout, but programmers can probably write code faster.
Different views have different properties when selected, but there are five main categories
Declared Attributes: Attributes that the control already has, click the + sign to add them
Layout: View width and height visible and set some constraint alignment
Transforms: Transforms such as rotations can be set, as shown below
Common Attributes: Some Common Attributes (which may be necessary), such as SRC for the image, TXT and Size for the TextView, etc
All Attributes: All the actionable Attributes of the current control, necessary or not, are here, sometimes recalled if forgotten in code.
๐ Drag and drop layout
Such as dynamic figure GIF
All UI controls can be dragged into the layout. Android has supported dragging since the beginning, but only controls can be dragged into the layout. Dragging and dropping UI controls into the layout is not supported. Then came ConstraintLayout, which has nice attributes, drag-and-drop support, reduced layout levels, and good multi-resolution adaptation. That’s a lot of love in one place.
ConstraintLayout
It’s a new (and by now quite old) feature that allows you to visually manipulate things, and it’s in Android Jetpack. You can achieve a large complex layout without nesting, with far more flexibility than a RelativeLayout.
She has great visual and experiential effects for parent placement, alignment, barrier constraints, keyframe animation, and more.
ConstraintLayout about this more small empty will special open a detailed explanation of the inside of the various SAO operation.
๐ other
๐ข author: Kom and Kom in Kom
๐ข reprint instructions – be sure to specify the source: Zhim Granular’s personal home page – column – Nuggets (juejin. Cn)
๐ข welcome to like ๐ collect ๐ message ๐