Dec 19, 2020
ConstraintLayout: Adding components programmatically.
Step by step adding a component to ConstraintLayout.
In this step-by-step tutorial, you will learn how to add UI components to ConstraintLayout.
The example uses viewBinding.
What should happen:
Perform step by step:
Step 1: Project creation
Сreate EmptyProject with root ConstraintLayout (id = constraint_layout):
Step 2: Component creation
In folder app -> res -> layout create a file button (tools: works only for preview), and in this file create a button:
Step 3: The concept of programmatically adding components to the ConstraintLayout
Hide the vertical line in AndroidStudio:
Editor -> General -> Appearance -> Show hard wrap guide
Open MainActivity and create a method for adding components UI to ConstraintLayout:
Explanation by lines of code:
13. binding — To get a layout containing ConstraintLayout.
16. increment — To change id.
18. lastID — To get the last id.
30. layout — To get ConstraintLayout to which will be added components UI.
31. button — To get Button to be added to ConstraintLayout.
33. button.id — To change id.
35. addView — to add a component.
37. set — initialization ConstraintSet.
38. clone — clone the current layout.
39. also — we use a short name instead of a long name.
40. connect — constrain the component. (1 param — who to attach,
2 param — which side to attach, 3 param — to whom to attach, 4 patam -which side to attach).
41. if — attach the first component to the top.
43. else — to attach other components to the previous ones.
48. applyTo — apply modified layout.
Step 4: Add component onClick
Add View.OnClickListener, create a listener initialization method and add it to onClick:
Create a method:
Implement onClick:
Run the application:
Step 5: Adding a component when clicking on an existing component
Foreword: there will be an error in this step, but we will find a SOLUTION.
Add a button to activity_main:
Attach a listener to a button:
Run the application:
As you can see, the initial button has lost its limitations, and this is normal, in the next step We will SOLVE this problem.
Step 6: Solving the problem of losing restrictions by parent components
Of course, the very first thing that comes to mind is just to add constraints to the root component along with the external components, BUT this is a VERY BAD IDEA.
WHY !!!???
Everything is very simple, imagine that you have not only a button but also 5–6 components. It turns out that everyone will have to write the old restrictions.
WHAT TO DO !!!???
Just read on =)))
SOLUTION — components will be added not to the parent ConstreintLayout but to the external:
In folder app -> res -> layout create a file constraint_layout:
Include constraint_layout in activity_main:
Slightly change the method of adding components:
Run the application:
Step 7: Attaching a listener to external components
In activity_main add TextView:
Change activity_main:
Change increment:
Slightly change the method of adding components:
Run the application:
Conclusion:
This example is good for adding every, ABSOLUTELY every component to kccclll, as well as events — the example is suitable for every, ABSOLUTELY every event.
Make your application beautiful.
Love what you do and EXPERIMENT !!!!))).
If you have any questions, you can ask them personally to Me at Twitter.
