1. 1/29/2015 www.ai-techsavvy.in 1 Android Programming: FrameLayout By Dr. Ramji M. Makwana Professor and Head, Computer Engineering Department A.D. Patel Institute of Technology New V. V. Nagar, Anand, Gujarat, India

2. 1/29/2015 www.ai-techsavvy.in 2 Outline Layout Brief Review Introduction to FrameLayout Examples: FrameLayout Design Reusability of Layouts Attributes

3. 1/29/2015 www.ai-techsavvy.in 3 Review of all layouts for given design

4. 1/29/2015 www.ai-techsavvy.in 4 Stack of Images in One Frame

5. 1/29/2015 www.ai-techsavvy.in 5 What is FrameLayout? FrameLayout is used to hold a single child view at a time out of multiple child views Can add multiple children to a FrameLayout Can control their position within the FrameLayout using the android:layout_gravity attribute. Child views are drawn in a stack, with the most recently added child on top. The size of the FrameLayout is the size of its largest child (plus padding). Attributes: viewObj.VISIBLE and viewObj.GONE.

6. 1/29/2015 www.ai-techsavvy.in 6 How FrameLayout Works? 1 st Frame2 nd Frame

7. 1/29/2015 www.ai-techsavvy.in 7.xml Code <FrameLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent“ android:layout_height="match_parent" android:orientation="vertical" > <ImageView android:id="@+id/imageView2" android:layout_gravity="center" android:src="@drawable/pswami" /> <ImageView android:id="@+id/imageView1" android:layout_gravity="center" android:src="@drawable/rose" />

8. 1/29/2015 www.ai-techsavvy.in 8 Java Code public class MainActivity extends Activity implements OnClickListener { ImageView i1, i2; protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.frame_layout); i1 = (ImageView) findViewById(R.id.imageView1); i2 = (ImageView) findViewById(R.id.imageView2); i1.setOnClickListener(this); i2.setOnClickListener(this); Log.d("AI-TechSavvy", "OnCreate Called..!"); }

9. 1/29/2015 www.ai-techsavvy.in 9 OnClick Method public void onClick(View v) { // TODO Auto-generated method stub if(v.getId()==R.id.imageView1) { i1.setVisibility(v.GONE); i2.setVisibility(v.VISIBLE); Log.d("AI-TechSavvy", “President Shri Modi..!"); } else {i1.setVisibility(v.VISIBLE); i2.setVisibility(v.GONE); Log.i("AI-TechSavvy", “HDH Pramukh Swami"); } }

10. 1/29/2015 www.ai-techsavvy.in 10 Demo and Practice

11. 1/29/2015 www.ai-techsavvy.in 11 Displaying multiple Views or ViewGroups but one at a time Img1 Img2 Img4 Img3

12. 1/29/2015 www.ai-techsavvy.in 12 On Next Button Click, Show One Image/Frame out of Multiple 1 st Frame Next 2 nd Frame3 rd Frame

13. 1/29/2015 www.ai-techsavvy.in 13 <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools" android:id="@+id/rlayout"> <FrameLayout android:id="@+id/flayout" android:layout_centerHorizontal="true" > <ImageView android:id="@+id/iv1" android:src = "@drawable/sachin" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_gravity="center" android:tag="1" />.. ……….

14. 1/29/2015 www.ai-techsavvy.in 14 ………………………… <ImageView android:id="@+id/iv3" android:src="@drawable/pswami" android:layout_gravity="center" android:tag="3" android:visibility="invisible" /> <Button android:layout_alignParentLeft="true" android:layout_alignParentRight="true" android:layout_below="@+id/flayout" android:onClick="btnClick" android:text="Next Image"/>

15. 1/29/2015 www.ai-techsavvy.in 15 MyFrameLayout.java public class MyFrameLayout extends Activity { int count=1; FrameLayout frame; ImageView imageview; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.framelayout1); frame= (FrameLayout)findViewById(R.id.flayout); }

16. 1/29/2015 www.ai-techsavvy.in 16 public void btnClick(View v) { // Hide current image imageview = (ImageView) frame.findViewWithTag(String.valueOf(count)); imageview.setVisibility(android.view.View.INVISIBLE); // go to next image count ++; if (count>3) count=1; // Show next image imageview=(ImageView)frame.findViewWithTag(String.valueOf(count)); imageview.setVisibility(android.view.View.VISIBLE); }

17. 1/29/2015 www.ai-techsavvy.in 17 Reusing layouts To efficiently re-use complete layouts, you can use the and tags to embed another layout inside the current layout. Any elements of your application that are common across multiple layouts can be extracted, managed separately, then included in each layout. Reusing layouts is powerful: Example, a yes/no button panel, or custom progress bar with description text.

18. 1/29/2015 www.ai-techsavvy.in 18 Re-using Layout <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent" android:gravity="center" android:orientation="vertical" > <TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="@string/hello_world" />

19. 1/29/2015 www.ai-techsavvy.in 19 tag for optimizing performance <Button android:layout_width="fill_parent" android:layout_height="wrap_content" android:text="Add"/> <Button android:layout_width="fill_parent" android:layout_height="wrap_content" android:text="Delete"/>

20. 1/29/2015 www.ai-techsavvy.in 20 Demo and Practice

21. 1/29/2015 www.ai-techsavvy.in 21 FrameLayout Attributes AttributesApply toWhat does it do?Value it take :foreground FrameLayou t Defines the drawable to draw over the content. This can be used as an overlay. resource in the form "@[+][pkg:]type:name" or to a theme in the form "?[pkg:][type:]name" May be a color value, in the form of "#rgb" :foregroundGra vity FrameLayou t Gravity of foreground drawable. Defaults to fill “center”, “top” :foregroundTintFrameLayou t Tint to apply to the foreground color value, in the form of "#rgb", "#argb"

22. 1/29/2015 www.ai-techsavvy.in 22 Thank You…!