i am trying to make a horizontal divider using View element. i wote the below code, but the problem is the divider is always of a very samll width despite the width of the View , as shown belwo, is set match_parent
please let emknow how to fix it.
update:
the problem is, the View is always as wide as the imageView??!! i do not know why? any explanation?
layout:
<?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"
android:orientation="vertical" >
<TableLayout
android:id="#+id/tl_MainTable"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center_horizontal"
android:orientation="vertical">
<TableRow
android:id="#+id/tr_Logo"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:weightSum="3">
<ImageView
android:id="#+id/iv_Logo"
android:layout_height="wrap_content"
android:src="#drawable/fr"
android:adjustViewBounds="true"
android:layout_weight="0"
android:contentDescription="#null"/>
<TextView
android:id="#+id/tv_Title"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical|center_horizontal"
android:gravity="center_horizontal"
android:layout_weight="3"
android:text="#string/str_Disc_Neigh_Device"/>
</TableRow>
<TableRow
android:id="#+id/tr_Divider"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<View
android:id="#+id/v_Divider"
android:layout_width="match_parent"
android:layout_height="3dp"
android:background="#90909090"/>
</TableRow>
</TableLayout>
Here's what I did in my own app but in a linear layout, though you can give it try:
<View
android:layout_width="fill_parent"
android:layout_height="1dp"
android:id="#+id/separator1"
android:visibility="visible"
android:background="#00000000"
android:layout_gravity="center_horizontal"/>
change background to your liking
Change your 2nd TableRow to LinearLayout
<LinearLayout
android:id="#+id/tr_Divider"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<View
android:id="#+id/v_Divider"
android:layout_width="match_parent"
android:layout_height="3dp"
android:background="#902631"
android:layout_span="2" />
</LinearLayout>
change view background colour as you wish.
Table layout is having its default divider android:showDividers="yourvalue" you can use it instead.
also to set the divider widht by using
android:dividerPadding="valueindp"
Related
Let me explain i have a xml like this
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<ImageView
android:id="#+id/imgCircle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/img_circle" />
<LinearLayout
android:id="#+id/llFirstScreen"
android:layout_alignTop="#id/imgCircle"
android:layout_alignBottom="#id/imgCircle"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_toRightOf="#id/imgCircle"
android:layout_toEndOf="#id/imgCircle"
android:background="#drawable/layout_view_round_corner"
android:orientation="vertical">
<TextView
android:id="#+id/mapCurrentLocation"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:text="TextView1"
android:textColor="#color/lblTextColor"
android:textSize="#dimen/lblTextLarge"
android:textStyle="normal" >
</TextView>
<TextView
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:text="TextView2"
android:textColor="#color/lblHintColor2"
android:textSize="#dimen/lblTextMedium"
android:textStyle="normal" >
</TextView>
</LinearLayout>
</RelativeLayout>
And this gives me Image and TextViews next to it
But i want to accomplish something like this
that TextView Background is extended (padding maybe) at the half of the Rounded Image (behind it) so that it looks like its "part" of the image. Or I was thinking of Making a view with background white that goes behind TextView so that it looks that way. But wanted to ask here maybe if there is a better way to do this.
I hope i was clear in explaining this (That is why I added pictures).
I have tried to use demo with your xml file and you can check below code. I had to give static height and width of the ImageView to achieve result.
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<LinearLayout
android:id="#+id/llFirstScreen"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignBottom="#id/imgCarCircle"
android:layout_alignTop="#id/imgCarCircle"
android:layout_marginLeft="30dp"
android:background="#color/colorAccent"
android:orientation="vertical"
android:paddingLeft="40dp">
<TextView
android:id="#+id/mapCurrentLocation"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:text="text1"
android:textStyle="normal"></TextView>
<TextView
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:text="text2"
android:textStyle="normal"></TextView>
</LinearLayout>
<ImageView
android:id="#+id/imgCarCircle"
android:layout_width="60dp"
android:layout_height="60dp"
android:src="#mipmap/ic_launcher_round" />
</RelativeLayout>
try these:
first solution: change this
<LinearLayout
android:id="#+id/llFirstScreen"
android:layout_alignTop="#id/imgCircle"
android:layout_alignBottom="#id/imgCircle"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_toRightOf="#id/imgCircle"
android:layout_toEndOf="#id/imgCircle"
android:background="#drawable/layout_view_round_corner"
android:orientation="vertical">
to this:
<LinearLayout
android:id="#+id/llFirstScreen"
android:layout_alignTop="#id/imgCircle"
android:layout_alignBottom="#id/imgCircle"
android:layout_width="match_parent"
android:layout_marginLeft="20dp" // or just figure your image width and set this programatically
android:layout_height="wrap_content"
android:background="#drawable/layout_view_round_corner"
android:orientation="vertical">
second solution: it to use AbsoluteLayout which is a bit hard to handle.
I try to create a semi-transparent red View and a TextView inside RelativeLayout, which the height of View follows the height of TextView, it works as expected when the TextView is above the semi-transparent red View:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">
<View
android:background="#FF0000"
android:alpha="0.5"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignBottom="#id/textView"/>
<TextView
android:id="#+id/textView"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="TEST"
android:textSize="50dp"
android:textColor="#000000"/>
</RelativeLayout>
but I want to change it a bit: put the View above the TextView and others remain unchanged, I tried change android:layout_alignBottom into android:layout_alignTop:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">
<View
android:background="#FF0000"
android:alpha="0.5"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignTop="#id/textView"/>
<TextView
android:id="#+id/textView"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="TEST"
android:textSize="50dp"
android:textColor="#000000"/>
</RelativeLayout>
but now the View seems doesn't follow the height of TextView:
What is the problem and how can I fix it?
Add android:layout_alignBottom="#+id/textView" in View. e.g.-
<View
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignTop="#id/textView"
android:layout_alignBottom="#+id/textView"
android:alpha="0.5"
android:background="#FF0000" />
I want to change it a bit: put the View above the TextView and others remain unchanged
If by saying above you mean atop of TextView regarding z-axis, then you're in a wrong way.
What you can do, is just to change the ordering of the views in your layout: the layout that is declared the first will be laid out first, next one would be laid out atop of it.
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">
<TextView
android:id="#+id/textView"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="TEST"
android:textSize="50dp"
android:textColor="#000000"/>
<View
android:background="#FF0000"
android:alpha="0.5"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignBottom="#+id/textView"/>
</RelativeLayout>
This is not working on my phone but I can see it in the Android Studio Design mode window. I need to place a LinearLayout or any view actually just below the listView. But I can't see it, only the listView fitting the whole height
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/local_detalle_relative_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
tools:context="android.buendia.cl.pritz.fragments.locales.LocalDetalleFragment">
<view
android:id="#+id/banner"
class="com.android.volley.toolbox.NetworkImageView"
android:layout_width="match_parent"
android:layout_height="80dp"
android:scaleType="centerCrop"
app:srcCompat="?android:attr/textSelectHandleLeft" />
<TextView
android:id="#+id/current_category"
style="#style/current_category"
android:layout_below="#+id/banner"
android:text="TextView" />
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_below="#+id/current_category">
<ListView
android:id="#+id/list_view_local_detalle"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"/>
<LinearLayout
android:id="#+id/cart_bar"
style="#style/cart_bar"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:orientation="horizontal">
<TextView
android:id="#+id/cart_status"
style="#style/cart_bar_status"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_weight="1"
android:gravity="center_vertical|center_horizontal"
android:text="TextView" />
<Button
android:id="#+id/cart_next"
style="#style/cart_bar_next"
android:layout_width="30dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="#string/cart_bar_next_button_text" />
</LinearLayout>
</RelativeLayout>
</RelativeLayout>
Set android:layout_below="#+id/list_view_local_detalle" for LinearLayout
Note : If you'r using weight for vertical linear layout then height must be 0 dp and if using for horizontal linear layout then width must be 0dp.
I am novice in Android trying to make this layout:
Simply what I want to achieve:
The red container should take as much space as it needs but not as much that green container have to be shrinked. If there are too many items, red container will be scrollable. Green container is also always centered in orange one if there is space for it (if not it is actually still centered).
I don't know how to do it at all :( . Here is my try:
The problem is that I want to always maintain height of green container (minHeight does not work I can't understand why) and make the green container centered in orange one. I have problem with Scenario 2 (as you can see in the picture), this code works good in first scenario.
<LinearLayout 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"
android:orientation="vertical">
<ScrollView
android:id="#+id/red_container"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#android:color/holo_red_dark"
android:scrollbarAlwaysDrawVerticalTrack="true">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<!-- Items are here -->
</LinearLayout>
</ScrollView>
<LinearLayout
android:id="#+id/orange_container"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#android:color/holo_orange_dark"
android:gravity="center"
android:orientation="vertical">
<LinearLayout
android:id="#+id/green_container"
android:layout_width="100dp"
android:background="#android:color/holo_green_dark"
android:layout_height="50dp"
android:orientation="horizontal">
<!-- My content -->
</LinearLayout>
</LinearLayout>
</LinearLayout>
Edit: minHeight does not help:
Edit: image for user Illegal Argument:
Try setting property android:minHeight = "(whatever)dp" to orangeContainer. This worked for me in others "similiar" cases.
:)
Is this what you are looking for:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent" >
<ScrollView
android:id="#+id/scrollView1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_above="#+id/list_items"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:background="#android:color/background_dark" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical" >
</LinearLayout>
</ScrollView>
<LinearLayout
android:id="#+id/list_items"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentLeft="true"
android:background="#android:color/darker_gray"
android:gravity="center"
android:minHeight="200dp"
android:orientation="vertical" >
<TextView
android:id="#+id/textView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="TextView" />
</LinearLayout>
</RelativeLayout>
Snapshot in ecllipse:
I want two Views inside a RelativeLayout with the same height one below the other.
I can't use LinearLayout's weight so I have to figure out another way to do it.
From what I googled and read on SO I found out as a solution to use an anchor View centerHorizontal in the parent View and place the 2 children one above and one below that anchor View, but it doesn't seems to work.
My code so far is :
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="2"
android:gravity="top" >
<View android:id="#+id/anchor"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_centerHorizontal="true"
android:background="#000"/>
<RelativeLayout
android:id="#+id/toplayout"
android:background="#990000"
android:layout_above="#+id/anchor"
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="match_parent" >
</RelativeLayout>
<RelativeLayout
android:id="#+id/bottomlayout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_below="#+id/anchor">
<RatingBar
android:id="#+id/ratingBar1"
android:layout_width="218dp"
android:layout_height="wrap_content" />
</RelativeLayout>
</RelativeLayout>
Is there a mistake to my code or the way I'm trying to solve it is wrong from the beginning?
Your approach is correct, but by the Anchor View, you set its layout to be Central Horizontal, but it should be Central Vertical. Also, you can use Align Top and Bottom to match the Views' edges.
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="fill_parent"
android:gravity="top" >
<RelativeLayout
android:id="#+id/toplayout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#990000"
android:orientation="horizontal"
android:layout_alignParentTop="true"
android:layout_alignBottom="#+id/anchor"
android:layout_above="#+id/anchor">
</RelativeLayout>
<View android:id="#+id/anchor"
android:layout_width="fill_parent"
android:layout_height="0dp"
android:layout_centerVertical="true"
android:background="#000"/>
<RelativeLayout
android:id="#+id/bottomlayout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_below="#+id/anchor"
android:layout_alignParentBottom="true"
android:layout_alignTop="#+id/anchor" >
<RatingBar
android:id="#+id/ratingBar1"
android:layout_width="218dp"
android:layout_height="wrap_content" />
</RelativeLayout>
</RelativeLayout>