2

enter image description here

How can I make this layout in android programmatically.

I want just an idea not whole coding thing.

4
  • why the image is not showing? You anyone see the image this problem is just with me? Commented Jul 17, 2014 at 7:00
  • I can see the Image. But you should explain it a bit more. Which parts are layout elements, what is static picture? Almost everything is possible with a RelativeLayout Commented Jul 17, 2014 at 7:02
  • Actually I don't know how to add these type of parameters, android:layout_alignBottom, android:layout_alignLeft etc Commented Jul 17, 2014 at 7:05
  • 1
    you need to set them with addRule() in RelativeLayout.LayoutParams. See the docs Commented Jul 17, 2014 at 7:10

3 Answers 3

3

Here is the answer but not the direct answer. This is what I personally do to create complex layout programatically.

Create the same layout in XML.

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent" >

<ImageView
    android:id="@+id/imageView1"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:layout_alignParentLeft="true"
    android:layout_alignParentTop="true"
    android:src="@drawable/some_big_image" />

<RelativeLayout
    android:layout_width="match_parent"
    android:layout_height="100dp"
    android:layout_alignParentBottom="true"
    android:layout_alignParentLeft="true"
    android:background="#DD000000" >

    <ImageView
        android:id="@+id/imageView2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentLeft="true"
        android:layout_centerVertical="true"
        android:src="@drawable/ic_launcher" />

    <TextView
        android:id="@+id/textView1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignTop="@+id/imageView2"
        android:layout_toRightOf="@+id/imageView2"
        android:text="TextView"
        android:textColor="@android:color/white" />

    <TextView
        android:id="@+id/textView2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignBottom="@+id/imageView2"
        android:layout_toRightOf="@+id/imageView2"
        android:text="TextView"
        android:textColor="@android:color/white" />
</RelativeLayout>

Now start from top parent to child.

    RelativeLayout mParent = new RelativeLayout(this);
    RelativeLayout.LayoutParams mParentParams = new RelativeLayout.LayoutParams(new RelativeLayout.LayoutParams(RelativeLayout.LayoutParams.MATCH_PARENT, RelativeLayout.LayoutParams.MATCH_PARENT));
    mParent.setLayoutParams(mParentParams);

    ImageView mBigImageView = new ImageView(this);
    mBigImageView.setLayoutParams(mParentParams);
    mParent.addView(mBigImageView);

As you practice you can directly code the same without creating xml.

Sign up to request clarification or add additional context in comments.

Comments

0

Basic Idea:

  1. Create a RelativeLayout which contains one ImageView and two TextView which is aligned bottom

  2. set the alpha of the RelativeLayout to adjust the transparency

2 Comments

Actually I don't know how to add these type of parameters, android:layout_alignBottom, android:layout_alignLeft etc.
@Yawar Please have a look on this link: developer.android.com/guide/topics/ui/layout/relative.html which will give you some basic idea
0

You can have one relative layout which contain one image view for big image and below it one more linear layout containing image and text as "pearl Continental ..." and background of liner layout should be 50-60% transparent. Create the background for LL using shapes. and set it as align bottom of parent (relative) layout. Hope this helps you

6 Comments

Actually I don't know how to add these type of parameters, android:layout_alignBottom, android:layout_alignLeft etc
Its better to create layout in xml and then inflate where you need. after inflating set the required values to each items
Also one sample is provided above
actually I have 3 views in view pager control, layout of all three are different from each other. And I'm searching something what you have suggested but couldn't find anything helpful. That's why doing it programatically.
if you have multiple views to display in view pager then you need to identify which one to display in adapter class and then inflate the respective view in adapter. So the same will be update in viewpager.
|

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.