textview is not fit inside fixed size height Relativelayout - android

<RelativeLayout android:layout_width="wrap_content"
android:layout_height="270dp">
<!-- Header aligned to top -->
<RelativeLayout
android:id="#+id/header1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:background="#de7925"
android:padding="10dp">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="center"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:textColor="#color/colorWhite"
android:textStyle="bold"
android:text="Personal Mobile" />
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:background="#drawable/ic_backspace" />
</RelativeLayout>
<!-- Footer aligned to bottom -->
<RelativeLayout
android:id="#+id/footer"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:background="#000000"
android:gravity="center"
android:padding="20dp">
<TextView
android:id="#+id/imageView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:textColor="#color/colorWhite"
android:text="QR CODE"/>
<ImageView
android:layout_width="36dp"
android:layout_height="36dp"
android:gravity="center"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:src="#drawable/ic_capture" />
<TextView
android:id="#+id/imageView2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:text="SCAN CARD"
android:textColor="#color/colorWhite" />
</RelativeLayout>
<!-- Content below header and above footer -->
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_above="#id/footer"
android:layout_below="#id/header1"
android:gravity="center">
<ImageView
android:id="#+id/barcode"
android:layout_width="90dp"
android:layout_height="90dp"
android:padding="10dp"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:src="#drawable/qrcode" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/barcode"
android:text="Exchange"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:textColor="#ffffff"
android:padding="10dp"
android:background="#color/colorCallGradientStart"
android:textSize="20sp" />
</RelativeLayout>
</RelativeLayout>
This is my XML; the height of RelativeLayout is 270 dp. I have to fix all the things inside RelativeLayout.
How do i fit TextView inside i.e. fix for size of relative layout.
My current screen:
this is my expected screen :
The QrCode image view and textview are not fitting. I want to fit the text so you cannot see the text exchange.

Try This
Your image size is too large and you have also given the padding to textview that's why your text is not displaying.
I have changed your specific code.
<!-- Content below header and above footer -->
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_above="#id/footer"
android:layout_below="#id/header1"
android:gravity="center">
<ImageView
android:id="#+id/barcode"
android:layout_width="70dp"
android:layout_height="70dp"
android:padding="10dp"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:src="#drawable/ic_launcher_background" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/barcode"
android:text="Exchange"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:textColor="#ffffff"
android:background="#color/colorDarkGolden"
android:textSize="20sp" />
</RelativeLayout>

Remove text padding and also make text width match_parent, remove gravity and orientation in RelativeLayout have look
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_above="#id/footer"
android:layout_below="#id/header1">
<ImageView
android:id="#+id/barcode"
android:layout_width="90dp"
android:layout_height="90dp"
android:padding="10dp"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:src="#drawable/qrcode" />
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/barcode"
android:text="Exchange"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:textColor="#ffffff"
android:background="#color/colorCallGradientStart"
android:textSize="20sp" />
</RelativeLayout>
Happy coding!!

Try this
Remove padding in your xml
android:padding="10dp"

You can do this-:
<RelativeLayout android:layout_width="wrap_content"
android:layout_height="290dp"
xmlns:android="http://schemas.android.com/apk/res/android">
<!-- Header aligned to top -->
<RelativeLayout
android:id="#+id/header1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:background="#de7925"
android:padding="10dp">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="center"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:textColor="#color/colorWhite"
android:textStyle="bold"
android:text="Personal Mobile" />
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:background="#drawable/ic_backspace" />
</RelativeLayout>
<!-- Footer aligned to bottom -->
<RelativeLayout
android:id="#+id/footer"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:background="#000000"
android:gravity="center"
android:padding="20dp">
<TextView
android:id="#+id/imageView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:textColor="#color/colorWhite"
android:text="QR CODE"/>
<ImageView
android:layout_width="36dp"
android:layout_height="36dp"
android:gravity="center"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:src="#drawable/ic_capture" />
<TextView
android:id="#+id/imageView2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:text="SCAN CARD"
android:textColor="#color/colorWhite" />
</RelativeLayout>
<!-- Content below header and above footer -->
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_above="#id/footer"
android:layout_below="#id/header1"
android:gravity="center">
<ImageView
android:id="#+id/barcode"
android:layout_width="90dp"
android:layout_height="90dp"
android:padding="10dp"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:src="#drawable/qrcode" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/barcode"
android:text="Exchange"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:padding="10dp"
android:textSize="20sp" />
</RelativeLayout>
</RelativeLayout>
instead of-:
android:layout_height="270dp"
to-:
android:layout_height="290dp"
Height is not as worth to fill all thimgs so change this and it will work

Remove Padding=10dp in your textview but if you want to keep it. Change your RelativeLayout to LinearLayout and your layout will be good.
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_above="#id/footer"
android:layout_below="#id/header1"
android:orientation="vertical"
android:gravity="center">
<ImageView
android:id="#+id/barcode"
android:layout_width="90dp"
android:layout_height="90dp"
android:padding="10dp"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:src="#drawable/qrcode" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/barcode"
android:text="Exchange"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:textColor="#ffffff"
android:padding="10dp"
android:background="#color/colorCallGradientStart"
android:textSize="20sp" />
</LinearLayout>

Related

How to place a Textview to the right and center of the Imageview in Relative Layout

I want to place a textview to the right and gravity centre of the Image View. I am using Relative Layout for that. Using Relative Layout, i am able to set the Textview to the right side of the Image view.But not able to set it to the centre. I mean here center is not inside of the Imageview, i want to place Textview to the right centre of Imageview(outside centre of Imageview).I am not able to set to centre.
Anybody please help me out.I want to do this only in relative layout.
Here is my xml,
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_height="wrap_content"
android:layout_marginTop="60dp"
android:layout_width="match_parent">
<TextView
android:id="#+id/name_text_view"
android:textSize="20sp"
android:layout_toRightOf="#id/image_view"
android:layout_width="wrap_content"
android:textColor="#color/black"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"/>
<ImageView
android:id="#+id/image_view"
android:layout_marginLeft="30dp"
android:layout_width="50dp"
android:layout_height="50dp"/>
<Button
android:id="#+id/button"
android:layout_centerHorizontal="true"
android:background="#color/blue"
android:textColor="#color/color_white"
android:layout_marginTop="20dp"
android:layout_below="#id/name_text_view"
android:layout_width="wrap_content"
android:layout_height="wrap_content"/>
<TextView
android:id="#+id/val_text_view"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="#color/black"
android:layout_marginTop="20dp"
android:textSize="18sp"
android:layout_centerHorizontal="true"
android:layout_below="#id/button"/>
</RelativeLayout>
You can do it with this code:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="60dp">
<ImageView
android:id="#+id/image_view"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:scaleType="center"
android:src="#drawable/ic_launcher_background" />
<TextView
android:id="#+id/name_text_view"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignRight="#+id/image_view"
android:layout_centerInParent="true"
android:text="hello world"
android:textColor="#color/black"
android:textSize="12sp" />
</RelativeLayout>
Use this code:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_height="wrap_content"
android:layout_marginTop="60dp"
android:layout_width="match_parent">
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:gravity="center_vertical"
>
<ImageView
android:id="#+id/image_view"
android:layout_marginLeft="30dp"
android:layout_width="50dp"
android:layout_height="50dp"/>
<TextView
android:id="#+id/name_text_view"
android:textSize="20sp"
android:layout_toRightOf="#id/image_view"
android:layout_width="wrap_content"
android:textColor="#color/black"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"/>
</LinearLayout>
<Button
android:id="#+id/button"
android:layout_centerHorizontal="true"
android:background="#color/blue"
android:textColor="#color/color_white"
android:layout_marginTop="20dp"
android:layout_below="#id/name_text_view"
android:layout_width="wrap_content"
android:layout_height="wrap_content"/>
<TextView
android:id="#+id/val_text_view"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="#color/black"
android:layout_marginTop="20dp"
android:textSize="18sp"
android:layout_centerHorizontal="true"
android:layout_below="#id/button"/>
</RelativeLayout>
You can add this in your textview
android:layout_centerInParent="true"
Do You want this view? then try this code.
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_height="wrap_content"
android:layout_marginTop="60dp"
android:layout_width="match_parent">
<LinearLayout
android:id="#+id/leaner1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginBottom="15dp"
android:gravity="center_vertical"
android:orientation="horizontal">
<ImageView
android:id="#+id/image_view"
android:layout_width="50dp"
android:layout_height="50dp"
android:layout_marginStart="30dp"
android:contentDescription="TODO"
app:srcCompat="#mipmap/ic_launcher" />
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="10dp"
android:orientation="horizontal">
<TextView
android:id="#+id/name_text_view"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Name:"
android:textColor="#android:color/black"
android:textSize="20sp" />
<TextView
android:id="#+id/val_text_view"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Value"
android:textColor="#android:color/black"
android:textSize="18sp" />
</LinearLayout>
</LinearLayout>
<Button
android:id="#+id/button"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/leaner1"
android:layout_marginTop="1dp"
android:background="#android:color/holo_blue_dark"
android:text="button"
android:textColor="#android:color/white" />
</RelativeLayout>

How to align textView on layout center without conflict with other view?

I have an issue trying align textView to the center of layout: when I try to do this - it has a conflict with a button on the left - if text is too long - it become hidden under the button. Text length can be very different and I need it in the center of layout but not under/on the button.
Here is the xml file of activity layout:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/item_content_action_bar_layout"
android:layout_alignParentTop="true"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"
android:background="#color/colorBlue"
android:padding="10dp">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/item_content_title"
android:textAppearance="?android:attr/textAppearanceMedium"
android:text="Title"
android:textColor="#color/colorWhite"
android:textAlignment="center"
android:singleLine="true"
android:layout_gravity="center_vertical"
android:textStyle="bold"
android:autoText="false"
android:layout_centerInParent="true"
android:layout_alignWithParentIfMissing="false"
android:layout_alignParentRight="false" />
<ImageButton
android:layout_width="120dp"
android:layout_height="45dp"
android:id="#+id/item_content_back_button"
android:background="#drawable/back_button_selector"
android:layout_centerVertical="true"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"
android:layout_marginRight="5dp" />
</RelativeLayout>
<ScrollView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/item_content_scroll_view"
android:layout_centerVertical="true"
android:layout_centerHorizontal="true"
android:fillViewport="true">
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical">
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
>
<ImageView
android:layout_width="125dp"
android:layout_height="125dp"
android:id="#+id/item_content_image"
android:src="#drawable/ic_no_thumbnail"
android:maxHeight="125dp"
android:maxWidth="125dp"
android:layout_alignParentLeft="false"
android:layout_alignParentStart="true"
android:layout_margin="10dp" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/item_content_subtitle"
android:textAppearance="?android:attr/textAppearanceMedium"
android:text="Subtitle"
android:layout_alignTop="#+id/item_content_image"
android:layout_toRightOf="#+id/item_content_image"
android:layout_toEndOf="#+id/item_content_image"
android:textSize="20dp"
android:textStyle="bold" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/item_content_pubdate"
android:textAppearance="?android:attr/textAppearanceSmall"
android:text="Date"
android:layout_below="#+id/item_content_subtitle"
android:layout_alignLeft="#+id/item_content_subtitle"
android:layout_alignStart="#+id/item_content_subtitle"
android:textSize="10dp"
android:layout_marginTop="10dp" />
</RelativeLayout>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/item_content_content"
android:textAppearance="?android:attr/textAppearanceMedium"
android:text="blabla"
android:layout_below="#+id/item_content_pubdate"
android:layout_alignStart="#+id/item_content_pubdate"
android:layout_alignParentStart="true"
android:layout_margin="10dp" />
</LinearLayout>
</ScrollView>
</LinearLayout>
Try using LinearLayout with layout-weight for this to avoid conflict. Change your first relativelayout to below one
<LinearLayout
android:id="#+id/item_content_action_bar_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/_white"
android:orientation="horizontal"
android:padding="10dp"
android:weightSum="7">
<ImageButton
android:id="#+id/item_content_back_button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginRight="5dp"
android:layout_weight="2"
android:background="#drawable/chemist" />
<TextView
android:id="#+id/item_content_title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_weight="5"
android:autoText="false"
android:gravity="center"
android:maxLines="2"
android:singleLine="true"
android:text="Title"
android:textAppearance="?android:attr/textAppearanceMedium"
android:textColor="#color/Black"
android:textStyle="bold" />
</LinearLayout>
Change Your RelativeLayout to LinearLayout and use android:layout_weight attribute of layout to do this.
<LinearLayout
android:id="#+id/item_content_action_bar_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/_white"
android:orientation="horizontal"
android:padding="10dp"
android:weightSum="1"
>
<ImageButton
android:id="#+id/item_content_back_button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginRight="5dp"
android:background="#drawable/chemist" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/item_content_title"
android:textAppearance="?android:attr/textAppearanceMedium"
android:text="Title"
android:textColor="#color/colorWhite"
android:textAlignment="center"
android:singleLine="true"
android:layout_gravity="center_vertical"
android:textStyle="bold"
android:gravity="center"
android:layout_weight="1"
android:autoText="false"/>
</LinearLayout>
Make the layout_gravity of the textview item_content_title as "center_horizontal".
And add android:layout_toLeftOf="#+id/item_content_title" under the ImageButton item_content_back_button.
Hope it was what you wanted.
Your Action bar layout has to be like this-
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/item_content_action_bar_layout"
android:layout_alignParentTop="true"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"
android:background="#color/colorBlue"
android:padding="10dp">
<ImageButton
android:layout_width="120dp"
android:layout_height="45dp"
android:id="#+id/item_content_back_button"
android:background="#drawable/back_button_selector"
android:layout_centerVertical="true"
android:layout_alignParentLeft="true"
android:layout_marginRight="5dp" />
<TextView
android:toRightOf="#id/item_content_back_button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/item_content_title"
android:textAppearance="?android:attr/textAppearanceMedium"
android:text="Title"
android:textColor="#color/colorWhite"
android:textAlignment="center"
android:singleLine="true"
android:layout_gravity="center_vertical"
android:textStyle="bold"
android:autoText="false"
android:layout_centerInParent="true" />
</RelativeLayout>

Circle ImageView in the center of layout

Sorry for my english. I want to create a circle ImageView and i use this library all is well, but i can't locate this image in the center of my layout. I create to display in all screen Resolutions, and i use layout_weight if use layout_weight I can not put a static size image.
Bellow is my xml:
<RelativeLayout
android:layout_weight="0.3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
>
<com.pkmmte.view.CircularImageView
android:layout_marginTop="30dp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/p_img"
android:id="#+id/imageProfile"
android:layout_alignParentTop="true"
android:layout_gravity="center" />
</RelativeLayout>
The result of this code:
UPD:
my xml
<RelativeLayout
android:layout_weight="0.4"
android:layout_width="match_parent"
android:layout_height="match_parent">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#mipmap/p_edit_proofile"
android:id="#+id/editProfile"
android:layout_gravity="right"
android:layout_alignParentTop="true"
android:layout_alignParentRight="true"
android:layout_alignParentEnd="true" />
<LinearLayout
android:layout_marginBottom="10dp"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent">
<RelativeLayout
android:layout_weight="0.3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
>
<com.pkmmte.view.CircularImageView
android:layout_marginTop="30dp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/p_img"
android:id="#+id/imageProfile"
android:layout_centAerInParent="true" />
</RelativeLayout>
<TextView
android:layout_marginTop="10dp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="18dp"
android:text=""
android:id="#+id/nameProfile"
android:layout_gravity="center_horizontal" />
<TextView
android:layout_marginTop="10dp"
android:layout_gravity="center_horizontal"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="18dp"
android:text=""
android:id="#+id/status" />
<TextView
android:layout_marginTop="10dp"
android:layout_gravity="center_horizontal"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="18dp"
android:text="test"
android:textColor="#4fcc54"
android:id="#+id/aided" />
<LinearLayout
android:layout_marginTop="20dp"
android:orientation="horizontal"
android:layout_gravity="center_horizontal"
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<TextView
android:gravity="center_vertical"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="18dp"
android:text="PIN"
android:id="#+id/pin"
android:layout_gravity="center_vertical" />
<ImageView
android:layout_marginLeft="80dp"
android:src="#mipmap/p_key"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/key" />
</LinearLayout>
</LinearLayout>
</RelativeLayout>
Use android:layout_centerInParent="true"
<com.pkmmte.view.CircularImageView
android:layout_marginTop="30dp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/p_img"
android:id="#+id/imageProfile"
android:layout_centerInParent="true" />
This will center the image in your RelativeLayout
In your nested RelativeLayout remove android:layout_weight and add android:layout_gravity = "center".
Try to use android:gravity="center_horizontal"
<RelativeLayout
android:layout_weight="0.3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="center_horizontal"
>
try to use this:
android:layout_centerInParent="true"
in the CircularImageView
Regards

Android center bottom numberpickers

I'm trying to create two number pickers in android. However i try to center them both at the bottom. I tried to mix up relative and linear layout, but i was not able to fix it.
The images shows how the buttons are placed at the moment. The red squares show how i want the buttons to be displayed.
Hope you can help me.
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context="com.pvdl.ndwatch.NDwatchActivity$PlaceholderFragment" >
<ImageView
android:id="#+id/background"
android:layout_width="wrap_content"
android:layout_height="300dp"
android:layout_alignParentLeft="true"
android:layout_alignParentRight="true"
android:layout_centerVertical="true"
android:scaleType="centerCrop"
android:src="#drawable/background" />
<TextView
android:id="#+id/textView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/nd_text"
android:textColor="#color/red"
android:textStyle="bold" />
<ImageView
android:id="#+id/imageView1"
android:layout_width="90dp"
android:layout_height="90dp"
android:layout_marginLeft="20dp"
android:layout_marginTop="20dp"
android:src="#drawable/ic_launcher" />
<View
android:layout_width="match_parent"
android:layout_height="5dp"
android:layout_marginLeft="150dp"
android:layout_marginTop="90dp"
android:background="#00ABCC" />
<TextView
android:id="#+id/title"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="150dp"
android:layout_marginTop="20dp"
android:text="#string/title"
android:textColor="#404041"
android:textSize="60sp" />
<TextView
android:id="#+id/title2"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="200dp"
android:layout_marginTop="30dp"
android:text="#string/title2"
android:textColor="#404041"
android:textSize="50sp" />
<RelativeLayout
android:id="#+id/frame"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/textView1"
android:layout_centerHorizontal="true" >
</RelativeLayout>
<ProgressBar
android:id="#+id/progressBar1"
style="?android:attr/progressBarStyleHorizontal"
android:layout_width="270dp"
android:layout_height="270dp"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:background="#android:color/transparent"
android:indeterminate="false"
android:max="100"
android:progress="0"
android:progressDrawable="#drawable/circular_progress_bar" />
<ImageButton
android:id="#+id/imageButton1"
android:layout_width="100dp"
android:layout_height="100dp"
android:layout_alignBottom="#+id/background"
android:layout_centerHorizontal="true"
android:layout_marginBottom="60dp"
android:background="#android:color/transparent"
android:onClick="onNDstart"
android:scaleType="fitXY"
android:src="#drawable/custom_button" />
<Chronometer
android:id="#+id/chronometer1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_above="#+id/imageButton1"
android:layout_centerHorizontal="true"
android:layout_marginBottom="15dp"
android:background="#android:color/transparent"
android:text="Chronometer"
android:textColor="#000000"
android:textSize="70sp"
android:textStyle="bold" />
<TextView
android:id="#+id/textView2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignBottom="#+id/background"
android:layout_marginBottom="40dp"
android:layout_centerHorizontal="true"
android:text="#string/start"
android:textColor="#color/red"
android:textStyle="bold" />
<NumberPicker
android:id="#+id/numberPicker2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentRight="true"
android:layout_weight="1"
android:entries="#array/shutter_times"
/>
<NumberPicker
android:id="#+id/numberPicker1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentLeft="true"
android:layout_weight="1"
android:entries="#array/nd_values"
android:gravity="bottom" />
</RelativeLayout>
Change your xml to this:
<RelativeLayout ...>
....
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:orientation="horizontal"
android:weightSum="2" >
<NumberPicker
android:id="#+id/numberPicker2"
android:layout_width="0dip"
android:layout_height="wrap_content"
android:layout_weight="1"
android:entries="#array/shutter_times" />
<NumberPicker
android:id="#+id/numberPicker1"
android:layout_width="0dip"
android:layout_height="wrap_content"
android:layout_weight="1"
android:entries="#array/nd_values" />
</LinearLayout>
</RelativeLayout>
If you want a space between the buttons just add a paddingRight to the left button and the same value to the paddingLeft of the right button.
Hope this helps.

Linear and Relative Layout aligment

I am unable to get the below shown layout..can anyone let me know how to achieve this layout ?
This is what I have but unable to get the specified layout.
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:layout_gravity="left"
android:layout_weight="1">
<ImageView
android:id="#+id/someimage"
android:layout_width="100dp"
android:layout_height="100dp"
android:background="#88FF0000" />
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:layout_gravity="right">
<TextView
android:id="#+id/txtview1"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:textColor="#000000"
android:textSize="14sp"
android:textStyle="bold" />
<TextView
android:id="#+id/txtview2"
android:layout_height="wrap_content"
android:focusable="false"
android:gravity="right"
android:layout_below="#id/txtview1"/>
<TextView
android:id="#+id/txtview3"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:gravity="right"
android:textColor="#003399"
android:textSize="19sp"
android:textStyle="bold"
android:layout_below="#id/txtview2"/>
</RelativeLayout>
</LinearLayout>
I want to get this as final layout:
You can use a single RelativeLayout
You can remove the unwanted RelativeLayout with black background. (Just to differentiate i added another relative layout with black background)
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent" >
<TextView
android:id="#+id/textView2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignLeft="#+id/textView1"
android:layout_below="#+id/textView1"
android:layout_marginTop="15dp"
android:text="TextView" />
<ImageView
android:id="#+id/imageView1"
android:layout_width="100dp"
android:layout_height="100dp"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:layout_marginLeft="19dp"
android:src="#drawable/ic_launcher" />
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#000000"
android:layout_below="#+id/imageView1" >
</RelativeLayout>
<TextView
android:id="#+id/textView3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignLeft="#+id/textView2"
android:layout_below="#+id/textView2"
android:layout_marginTop="16dp"
android:text="TextView" />
<TextView
android:id="#+id/textView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_alignParentTop="true"
android:layout_marginRight="54dp"
android:layout_marginTop="14dp"
android:text="TextView" />
</RelativeLayout>
Edit:
You can also center the text in TextView and use match_parent for the layout width and remove the unwanted realtive layout. Notice the change android:layout_toRightOf="#+id/imageView1" in the below code.
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent" >
<TextView
android:id="#+id/textView2"
android:layout_toRightOf="#+id/imageView1"
android:layout_width="match_parent"
android:gravity="center"
android:layout_height="wrap_content"
android:layout_alignLeft="#+id/textView1"
android:layout_below="#+id/textView1"
android:layout_marginTop="15dp"
android:text="TextView" />
<ImageView
android:id="#+id/imageView1"
android:layout_width="100dp"
android:layout_height="100dp"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:layout_marginLeft="19dp"
android:src="#drawable/ic_launcher" />
<TextView
android:id="#+id/textView3"
android:layout_toRightOf="#+id/imageView1"
android:layout_width="match_parent"
android:gravity="center"
android:layout_height="wrap_content"
android:layout_alignLeft="#+id/textView2"
android:layout_below="#+id/textView2"
android:layout_marginTop="15dp"
android:text="TextView" />
<TextView
android:id="#+id/textView1"
android:layout_toRightOf="#+id/imageView1"
android:layout_width="match_parent"
android:gravity="center"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_alignParentTop="true"
android:layout_marginTop="15dp"
android:text="TextView" />
</RelativeLayout>
snap
You need to set the layout_width of all TextViews to fill_parent.
Note that your code should not even compile because the layout_width attribute is mandatory, and you don't specify it for the second TextView, and it also does not have a style attribute where it might be specified.
The below hierarchy can also do what you want:
Linear-Horizontal
Linear-Vertical
imageview
Linear-Horizontal
textview
textview
textview
What about a vertical linear layout where you put the image view in. Also put a horizontal linear layout in, where you place the textviews. Set the vertical height to wrap content and the horizontal to match parent.
Let me know if this works for you
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:layout_gravity="left"
android:layout_weight="1">
<ImageView
android:id="#+id/someimage"
android:layout_width="100dp"
android:layout_height="100dp"
android:background="#88FF0000" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content" >
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="right" >
<TextView
android:id="#+id/txtview1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_marginTop="2dp"
android:gravity="center"
android:text="TextView1"
android:textSize="14sp"
android:textStyle="bold" />
<TextView
android:id="#+id/txtview2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#id/txtview1"
android:focusable="false"
android:gravity="center"
android:text="TextView2" />
<TextView
android:id="#+id/txtview3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="19sp"
android:textStyle="bold"
android:gravity="center"
android:text="Textview 3"
android:layout_below="#id/txtview2"/>
</RelativeLayout>
</LinearLayout>
</LinearLayout>

Categories

Resources