I have a spinner which has an item template. Inside I have a textview and a checkbox that fills the layout, but it is fixed at left border (see image). How do I make checkbox centered, while not wrapping it's content? Padding and margins don't work.
Link to checkbox image
Item template layout:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:local="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="?android:attr/listPreferredItemHeight">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:weightSum="1">
<TextView
style="?android:attr/spinnerDropDownItemStyle"
android:background="#drawable/location_item_dash"
android:foreground="#000"
android:ellipsize="marquee"
android:singleLine="true"
android:textColor="#FFFFFF"
local:MvxBind="Text LocationName"
android:id="#+id/spinnertext"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="0.8" />
<CheckBox
local:MvxBind="Checked Selected"
android:background="#drawable/location_item_dash"
android:id="#+id/spinnercheck"
android:gravity="center"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="0.2"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:layout_centerInParent="true" />
</LinearLayout>
</LinearLayout>
Wrap your checkbox inside another layout and use center gravity in outer layout.
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:weightSum="1">
<TextView
android:id="#+id/spinnertext"
style="?android:attr/spinnerDropDownItemStyle"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="0.8"
android:background="#drawable/location_item_dash"
android:ellipsize="marquee"
android:foreground="#000"
android:singleLine="true"
android:textColor="#FFFFFF"
local:MvxBind="Text LocationName" />
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_weight="0.2"
android:gravity="center">
<CheckBox
android:id="#+id/spinnercheck"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_centerHorizontal="true"
android:layout_centerInParent="true"
android:layout_centerVertical="true"
android:background="#drawable/location_item_dash"
android:gravity="center"
local:MvxBind="Checked Selected" />
</LinearLayout>
</LinearLayout>
Related
How to set TextView object tvOperationDesc below tvOperationName
This is my layout 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"
android:paddingLeft="#dimen/activity_horizontal_margin"
android:paddingRight="#dimen/activity_horizontal_margin">
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="horizontal" >
<TextView
android:id="#+id/tvOperationName"
android:layout_width="0sp"
android:layout_height="fill_parent"
android:layout_weight="2"
android:gravity="center_vertical"
/>
<TextView
android:id="#+id/tvOperationDesc"
android:layout_width="0sp"
android:layout_height="fill_parent"
android:layout_weight="2"
android:gravity="center_vertical"
android:layout_below="#+id/tvOperationName"
/>
<EditText
android:id="#+id/txtMultiplier"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:gravity="center"
android:inputType="numberDecimal"
android:text="0"
android:textAppearance="?android:attr/textAppearanceSmall" />
<CheckBox
android:id="#+id/cbChkBox"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</LinearLayout>
</RelativeLayout>
Use 2 separate horizontal linear layouts in your relative layout and you can adjust the weights and the heights as you like:
<?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:paddingLeft="#dimen/activity_horizontal_margin"
android:paddingRight="#dimen/activity_horizontal_margin">
<LinearLayout
android:id="#+id/upLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:weightSum="3">
<TextView
android:id="#+id/tvOperationName"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="2" />
<EditText
android:id="#+id/txtMultiplier"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:gravity="center"
android:inputType="numberDecimal"
android:text="0"
android:textAppearance="?android:attr/textAppearanceSmall" />
<CheckBox
android:id="#+id/cbChkBox"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:layout_below="#+id/upLayout">
<TextView
android:id="#+id/tvOperationDesc"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="center_vertical"/>
</LinearLayout>
</RelativeLayout>
Textview below textview in horizontal linear layout
Not possible at all. Its clearly mentioned horizontal linear layout. So, you views are aligned horizontally only.
Then
If you set your linear layout orientation to horizontal your views are aligned horizontally & orientation to vertical your views are aligned vertically in linear manner that means one by one.
Solution
One relative layout is enough for your requirements. Have a look at my answer How relative layout views are aligned will help you.
Please try below code.
<TextView
android:id="#+id/tvOperationDesc"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:text="Description" />
<LinearLayout
android:id="#+id/secondLinearLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<TextView
android:id="#+id/tvOperationName"
android:layout_width="0sp"
android:layout_height="fill_parent"
android:layout_weight="2"
android:gravity="center_vertical"
android:text="Name" />
<EditText
android:id="#+id/txtMultiplier"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:gravity="center"
android:inputType="numberDecimal"
android:text="0"
android:textAppearance="?android:attr/textAppearanceSmall" />
<CheckBox
android:id="#+id/cbChkBox"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</LinearLayout>
if you want EditText and Checkbox in the same line as tvOperationName vertically just change orientation of secondLinearLayout to vertical and give gravity="center_horizontal" to secondLinearLayout.
Add another LinearLayout with orientation to vertical, and place both the TextView.
And remove layout_below property inside LinearLayout’s child view, as its useless.
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="horizontal" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<TextView
android:id="#+id/tvOperationName"
android:layout_width="0sp"
android:layout_height="fill_parent"
android:layout_weight="2"
android:gravity="center_vertical"
/>
<TextView
android:id="#+id/tvOperationDesc"
android:layout_width="0sp"
android:layout_height="fill_parent"
android:layout_weight="2"
android:gravity="center_vertical"
android:layout_below="#+id/tvOperationName"
/>
</LinearLayout>
Here is my xml code, it has an ImageView which stands before LinearLayout id = "linearLayout2" :
<?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">
<LinearLayout
android:orientation="horizontal"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:id="#+id/linearLayout1"
android:background="#drawable/border"
android:paddingBottom="5dp">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/imageView"
android:src="#drawable/ic_swap"
android:layout_gravity="center_vertical" />
<LinearLayout
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/linearLayout2"
android:paddingBottom="5dp"
android:layout_marginRight="5dp">
<AutoCompleteTextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/fromStationField"
android:completionThreshold="1"
android:hint="From"
android:textAlignment="textStart"
android:gravity="left|start"
android:layout_gravity="left" />
<AutoCompleteTextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/toStationField"
android:completionThreshold="1"
android:hint="To"
android:background="#android:color/transparent"
android:paddingRight="4dp"
android:paddingLeft="4dp" />
</LinearLayout>
</LinearLayout>
</RelativeLayout>
What I want to do is to make an ImageView stands after the LinearLayout id = "linearLayout2" like I show in an image bellow.
How to do this using only xml ?
One solution could be inside of linearLayout1 to move the ImageView after linearLayout2. Then set linearLayout1's width to match_parent and the sibling views width to 0dp. Lastly, use layout_weight to achieve the proportion of size you want for the ImageView and LinearLayout2.
<?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">
<LinearLayout
android:id="#+id/linearLayout1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#drawable/border"
android:orientation="horizontal"
android:paddingBottom="5dp"
android:weightSum="10">
<LinearLayout
android:id="#+id/linearLayout2"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginRight="5dp"
android:layout_weight="9"
android:orientation="vertical"
android:paddingBottom="5dp">
<AutoCompleteTextView
android:id="#+id/fromStationField"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="left"
android:completionThreshold="1"
android:gravity="left|start"
android:hint="From"
android:textAlignment="textStart" />
<AutoCompleteTextView
android:id="#+id/toStationField"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#android:color/transparent"
android:completionThreshold="1"
android:hint="To"
android:paddingLeft="4dp"
android:paddingRight="4dp" />
</LinearLayout>
<ImageView
android:id="#+id/imageView"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:layout_weight="1"
android:src="#android:drawable/ic_swap" />
</LinearLayout>
</RelativeLayout>
In the layout below, I'm using negative margins in the ImageView and a positive margin in the LinearLayout container left of ImageView so that we don't need to use layout_weight property and can keep using match_parent. For this you need to fix the size of your ImageView. Check this code out:
<?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">
<LinearLayout
android:orientation="horizontal"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:id="#+id/linearLayout1"
android:background="#drawable/border"
android:paddingBottom="5dp">
<LinearLayout
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/linearLayout2"
android:layout_marginRight="55dp"
android:paddingBottom="5dp">
<AutoCompleteTextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/fromStationField"
android:completionThreshold="1"
android:hint="From"
android:textAlignment="textStart"
android:gravity="left|start"
android:layout_gravity="left" />
<AutoCompleteTextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/toStationField"
android:completionThreshold="1"
android:hint="To"
android:background="#android:color/transparent"
android:paddingRight="4dp"
android:paddingLeft="4dp" />
</LinearLayout>
<ImageView
android:layout_width="50dp"
android:layout_height="50dp"
android:id="#+id/imageView"
android:src="#drawable/ic_swap"
android:layout_marginLeft="-55dp"
android:layout_gravity="center_vertical" />
</LinearLayout>
</RelativeLayout>
I want to add space between each items in the column has well i want add a little space between each row,i had tried padding ,divider and applying null it is'nt working in my case.
I have added divider height to listview has in below code but not working out
<LinearLayout android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<ListView android:id="#+id/listView"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:divider="#android:color/transparent"
android:dividerHeight="10.0sp"/>/>
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:textSize="25dp"
android:textStyle="bold"
android:text="total and comment section" />
</LinearLayout>
and items layout is which displays items in the listview
<?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="horizontal" >
<TextView
android:id="#+id/textView1"
android:layout_gravity="center"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="25dp"
android:text="TextView" />
<TextView
android:id="#+id/textView2"
android:layout_gravity="center"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="25dp"
android:text="TextView" />
</LinearLayout>
Did you try to set paddings or margins to each row of list view in custom ArrayAdapter?
for space in row you want to set dividerHeight of listview
and for column
you want to set android:layout_marginLeft for right text view
<?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="horizontal" >
<TextView
android:id="#+id/textView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:text="TextView"
android:textSize="25dp" />
<TextView
android:id="#+id/textView2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_marginLeft="50dp"
android:text="TextView"
android:textSize="25dp" />
</LinearLayout>
Try this
android:layout_height="0dp"
android:layout_weight="1"
android:divider="#00000000"
android:dividerHeight="5dp"
I am working to update my app with CardCiew widget, I already update some simple layout.
The problem that when I use a LinearLayout set with layout_weight attribute I get a different result I want.
layout.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:background="#drawable/list_selector"
android:orientation="horizontal"
android:id="#+id/technologie_ll_item">
<android.support.v7.widget.CardView
android:layout_width="fill_parent"
android:layout_height="wrap_content">
<LinearLayout
android:layout_weight="10"
android:layout_height="wrap_content"
android:layout_width="wrap_content">
<LinearLayout
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="2">
<de.hdodenhof.circleimageview.CircleImageView
android:id="#+id/iv_logo_technologie"
android:layout_width="75dp"
android:layout_height="75dp"
app:border_width="2dp"
app:border_color="#99069d78"
android:src="#drawable/after"
android:paddingLeft="0dp" />
</LinearLayout>
<LinearLayout
android:layout_width="0dp"
android:layout_weight="5"
android:layout_height="fill_parent"
android:gravity="center_vertical"
android:orientation="vertical">
<TextView
android:id="#+id/tv_nom_technologie"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:textSize="17dp"
android:textAllCaps="true"
android:paddingLeft="10dp"
android:gravity="center_vertical"
android:text="Orthodontics"/>
</LinearLayout>
<LinearLayout
android:layout_width="0dp"
android:layout_weight="1"
android:layout_height="fill_parent"
android:gravity="right"
android:orientation="horizontal">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/indic" />
</LinearLayout>
</LinearLayout>
</android.support.v7.widget.CardView>
</LinearLayout>
Result
Maybe this can help you.
Approach 1
(Note i have changed your CircleImageView with a Imageview so i could make it works without errors ;))
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:id="#+id/technologie_ll_item">
<android.support.v7.widget.CardView
android:layout_width="fill_parent"
android:layout_height="wrap_content">
<LinearLayout
android:weightSum="10"
android:layout_height="wrap_content"
android:layout_width="match_parent">
<LinearLayout
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="2">
<ImageView
android:id="#+id/iv_logo_technologie"
android:layout_width="75dp"
android:layout_height="75dp"
android:paddingLeft="0dp" />
</LinearLayout>
<TextView
android:id="#+id/tv_nom_technologie"
android:layout_width="0dp"
android:layout_weight="7"
android:layout_height="wrap_content"
android:textSize="17sp"
android:textAllCaps="true"
android:paddingLeft="10dp"
android:layout_gravity="center_vertical"
android:text="Orthodontics" />
<LinearLayout
android:layout_width="0dp"
android:layout_weight="1"
android:layout_height="fill_parent"
android:gravity="right"
android:orientation="horizontal">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</LinearLayout>
</LinearLayout>
</android.support.v7.widget.CardView>
As you can see you will have 1 LinearLayout which android:weightSum is 10 (just to make the proportion better) that holds the 3 components. The first LinearLayout container that holds the CircleImageView (aka ImageView in my code) will have a android:layout_weight of 2, the text will have a android:layout_weight of 7, and the arrow container will have a android:layout_weight of 1.
Maybe you can get rid of the LinearLayout that holds the arrow, and set the weight directly in the ImageView, i think that if you apply the arrow as android:src it will be resized respecting the scale of the image given, but I am not sure about this now.
Approach 2:
Another solution will be the RelativeLayout, as the code below:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:id="#+id/technologie_ll_item">
<android.support.v7.widget.CardView
android:layout_width="fill_parent"
android:layout_height="wrap_content">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<!-- CircleImageView here -->
<ImageView
android:id="#+id/iv_logo_technologie"
android:layout_width="75dp"
android:layout_height="75dp"
android:layout_alignParentLeft="true"
android:layout_centerVertical="true"
android:paddingLeft="0dp" />
<!-- Arrow drawable here -->
<ImageView
android:id="#+id/arrow"
android:layout_alignParentRight="true"
android:layout_centerVertical="true"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
<!-- Text here, between circle and arrow -->
<TextView
android:id="#+id/tv_nom_technologie"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:textSize="17sp"
android:layout_toRightOf="#id/iv_logo_technologie"
android:layout_toLeftOf="#id/arrow"
android:textAllCaps="true"
android:paddingLeft="10dp"
android:layout_centerVertical="true"
android:text="Orthodontics" />
</RelativeLayout>
</android.support.v7.widget.CardView>
</LinearLayout>
With this you remove the LinearLayout and you will have only 3 components, maybe better for perfomance.
Hope some of this will help you mate.
Regards!
I am trying to make a layout with an image on the left side, then a text, and two images on the right side. I show you how it likes now:
I want to put the two right icons on the right side, next to the limit of the screen. Then, if you see, when the text has more than one line, the two icons disappear and when the text is too long the icons are very small. I want a static space for every one of the icons.
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:padding="6dip">
<ImageView
android:id="#+id/icon"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:layout_alignParentLeft="true"
android:layout_marginRight="6dip"
android:layout_centerVertical="true"
android:src="#drawable/ic_launcher"
android:focusable="false"
android:focusableInTouchMode="false"
android:contentDescription="#string/cdLogo" />
<LinearLayout
android:id="#+id/lista2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:orientation="vertical"
android:paddingRight="20dip"
android:layout_toRightOf="#id/icon"
android:layout_marginRight="30dip">
<TextView
android:id="#+id/tituloevento"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:gravity="left"
android:textStyle="bold" />
<TextView
android:id="#+id/distritoevento"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:gravity="left"
android:textSize="12sp"/>
<TextView
android:id="#+id/coorp0"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:visibility="gone" />
<TextView
android:id="#+id/coorp1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:visibility="gone" />
<TextView
android:id="#+id/esgratis"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:visibility="gone" />
</LinearLayout>
<LinearLayout
android:id="#+id/caracteristicas"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:orientation="vertical"
android:layout_toRightOf="#id/lista2"
android:layout_alignParentRight="true">
<ImageView
android:id="#+id/iconoMapa"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:contentDescription="#string/cdTieneCoor"
android:layout_weight="0.5"/>
<ImageView
android:id="#+id/iconoGratis"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:contentDescription="#string/cdGratisPago"
android:layout_weight="0.5"/>
</LinearLayout>
</RelativeLayout>
I suggest you to use a LinearLayout as the top container, and distribute the space of the child elements with weight attributes. When using weight, you must set layout_width to 0dp for horizontal layouts or layout_heigth to 0dp for vertical layouts.
For example:
<?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="horizontal" >
<ImageView
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="2" />
<LinearLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="5" >
</LinearLayout>
<LinearLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="2" >
</LinearLayout>
</LinearLayout>