FramesLayout & Image View

Pages20-21

FrameLayout • is a ViewGroup that divides the screen into

blocks of area each of which is supposed to holds a single child View. You may place multiple child Views inside a single block, then the latter ones will overlay the preceding ones. The android:layout_gravity attribute of the child View will dictate which block it will go into. Let's build a page using FrameLayout as the layout model that contains an ImageView overlaid with a TextView.

Creating a FrameLayout• Create a new Activity called "FrameLayout", then

follow these steps to create a UI.– Open its layout XML file "activity_frame_layout.xml"

in Design view– Delete the default RelativeLayout and TextView– Drag and drop a FrameLayout layout from the Palette

to the screen– Drag and drop an ImageView to the center of the

screen and set its src property to "@drawable/ic_launcher"

– Drag and drop a Large Text to overlay the ImageView

FrameLayout & Image View

Code for FrameLayout• Open the "activity_frame_layout.xml" in Text view,

the XML content should look like the image on the next slide.

• The code was hard coded the text for the android:text attribute of the TextView here, what a sin! But you should heed the advice from Learning Point 7.

• Try changing the value to the android:layout_gravity attribute and watch the change taking place in the Preview screen

Final Result