Programming Layout Properties

At the moment we are relying on default settings for the properties, and the layout properties in particular, of the View objects we are creating. However, in practice you could spend the time and lines of code to set all of the properties needed to create any user interface and layout you wanted to. 

You now know how to create a UI completely in code. All you have to do is create all of the objects you need, set their properties and add them to suitable layout objects. This is a little more complicated than you might think because each layout type has a different set of layout properties. Exactly how this is done is easy enough, but if you don't want to know about it at this stage you can skip ahead as it doesn't change any of the general principles.

As explained in the previous chapter, each type of Layout has an associated class derived from LayoutParams called layout.LayoutParams where layout is the name of the Layout class. For example, LinearLayout has the LinearLayout.LayoutParams class, which is used to define all of the layout properties that a View object can use when added to a LinearLayout object. 

You can probably guess how to make use of the LayoutParams class. All you do is create a correctly initialized instance of the appropriate LayoutParams class and use setLayoutParams on any View object you want to customize. 

For example, to set the height and width in a LayoutParams object we could use:

val LP= LinearLayout.LayoutParams(100,100)

There is a constructor for all of the LayoutParams classes that accepts just the width and the height properties. Once you have a LayoutParams object you can assign it to any View object by setting the View object’s LayoutParams property:

b3.layoutParams =LP
linLayout.addView(b3)

With this change the third button in our previous layout will be exactly 100 by 100 pixels. 

Notice that the constructor works in pixels, i.e. px, instead of device-independent pixels, dp. You can also use constants for MATCH_PARENT and WRAP_CONTENT. For example:

val LP=LinearLayout.LayoutParams(WRAP_CONTENT,WRAP_CONTENT)

There is also a constructor that allows you to set the weight. Other layout properties have to be set using properties after the constructor has done its job. Some properties might have to set using set property methods. For example:

LP.setMargins(20,20,20,20)

which sets the left, top, right and bottom margins accordingly: 

More complex Layout objects have correspondingly more complex LayoutParams that you have to spend time setting up. 

So to be clear – there are properties such as text that you set directly on the View object, but there are also Layout properties that you have to set on an appropriate LayoutParams object, which is then set as the View object's LayoutParam property. 

Summary

• All of the UI components are derived from the View class.

• An Activity can host and display a single instance of the View class set by one of its setContentView methods.

• You can create instances of View objects in code and set them to be displayed by the Activity.

• A Layout or ViewGroup object is a View object that can contain many View objects, so creating a sophisticated layout that the Activity can display.

• Each Layout has its associated LayoutParams class, which is used by each View object it contains to control how it treats it within the layout. 

• You generally have to create an instance of the LayoutParams class, set the parameters you want to determine, and then set the instance as the LayoutParams of each View object that needs to use it via the LayoutParams property.

• The use of Layout containers results in a View hierarchy, i.e. a hierarchy of View objects which are displayed by the Activity.

• You can also code the View hierarchy using XML. Each XML tag corresponds to a View object and they are nested to define the hierarchy. The properties of the objects are set within the XML as attributes. Layout properties are treated in the same way but with layout_ as a prefix.

• When the time comes for the View hierarchy to be assigned to the Activity, the XML file is converted into a nested set of View objects by the use of an inflater method. This simply reads the XML and converts each tag to an object and sets the object’s properties.

• To find particular View objects in an inflated hierarchy the usual approach in Kotlin is to generate properties corresponding to the ids. If you don’t want to do this then you have to use use the findViewById method.

• Mike James, founder, editor and prolific contributor to I Programmer is also the author of Programmer's Guide to Kotlin and of Android Programming In Java: Starting with an App

Android Programming In Kotlin
Starting with an App

Covers Android Studio 3 and Constraint Layout.

Is now available as a print book:

Buy from: Amazon


Contents

1. Getting Started With Android Studio 3
2. The Activity And The UI
       Extract: Activity & UI  
3. Building The UI and a Calculator App
       Extract: A First App
4. Android Events
5. Basic Controls
       Extract Basic Controls
       Extract More Controls ***NEW!
6. Layout Containers
       Extract Layouts - LinearLayout
7. The ConstraintLayout 
       Extract Bias & Chains
8. Programming The UI
       Extract Programming the UI
       Extract Layouts and Autonaming Components
9. Menus & The Action Bar
10. Menus, Context & Popup
11. Resources
        Extract Conditional Resources
    
12. Beginning Bitmap Graphics
        Extract Animation
13. Staying Alive! Lifecycle & State
        Extract  State Managment
14. Spinners
15. Pickers
16. ListView And Adapters

17. Android The Kotlin Way

If you are interested in creating custom template also see:

Custom Projects In Android Studio

To be informed about new articles on I Programmer, sign up for our weekly newsletter, subscribe to the RSS feed and follow us on Twitter, Facebook or Linkedin.

Comments

Make a Comment or View Existing Comments Using Disqus

or email your comment to: comments@i-programmer.info

<ASIN:1871962544>

<ASIN:1871962536>