How to make radio buttons in the radio group in the same alignment and put button in the right and text in the left on Android?
I want to make a radio group with radio buttons. I want to do it like this
My code does it like this:
How can I adjust the alignment of all the radio bottoms and how can I put the button on the right and text on the left?
I do it by padding
Here is my code:
<RadioGroup
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_gravity="center|center_horizontal"
android:gravity="center|center_horizontal|center_vertical">
<RadioButton
android:id="#+id/ÅlandIslands"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center|center_horizontal"
android:layout_marginTop="20dp"
android:layout_weight="1"
android:paddingRight="250dp"
android:text="Åland Islands" />
<RadioButton
android:id="#+id/Albania"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center|center_horizontal"
android:layout_marginTop="20dp"
android:layout_weight="1"
android:paddingRight="250dp"
android:text="Albania" />
<RadioButton
android:id="#+id/Algeria"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center|center_horizontal"
android:layout_marginTop="20dp"
android:layout_weight="1"
android:paddingRight="250dp"
android:text="Algeria" />
<RadioButton
android:id="#+id/AmericanSamoa"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center|center_horizontal"
android:layout_marginTop="20dp"
android:layout_weight="1"
android:paddingRight="250dp"
android:text="American Samoa" />
<RadioButton
android:id="#+id/Andorra"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center|center_horizontal"
android:layout_marginTop="20dp"
android:layout_weight="1"
android:paddingRight="250dp"
android:text="Andorra" />
</RadioGroup>
Your code is almost fine, You need to set each RadioButtons width to android:layout_width="match_parent" so your each radio button will occupy full width of its parent layout.
It would be much better if you use recycler view as it would be easier to maintain in case of data changes and you could also implement features like search and sort with it.
Related
I have a requirement to create UI like below
You can see here the number is the highlighted part and it is in center always.
And we scroll it from left to right or vice versa.
I want to achieve this So, I wrote some code like below. But I don't have any Idea on how to add scroll effect to it and bring highlighted text to center
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center_horizontal"
app:layout_constraintBottom_toTopOf="#+id/idCameraControlBottom"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent">
<TextView
android:id="#+id/idZoom1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginEnd="50dp"
android:text="."
android:textAlignment="textEnd"
android:textSize="20sp"
android:textStyle="bold" />
<TextView
android:id="#+id/idZoom2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginEnd="50dp"
android:background="#drawable/circle_shade"
android:gravity="center"
android:text="1X"
android:textSize="16sp" />
<TextView
android:id="#+id/idZoom3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="."
android:textAlignment="viewStart"
android:textSize="20sp"
android:textStyle="bold" />
</LinearLayout>
Any Idea/Help is greatly appreciated.
You can create it like so:
<RelativeLayout
android:layout_centerInParent="true"
android:layout_width="100dp"
android:layout_height="wrap_content">
<HorizontalScrollView
android:layout_width="match_parent"
android:layout_height="wrap_content">
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal">
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="1"/>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="1"/>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="1"/>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="1"/>
</LinearLayout>
</HorizontalScrollView>
<TextView
android:layout_centerInParent="true"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#000"
android:textColor="#fff"
android:text="1"/>
</RelativeLayout>
Change it as you see fit, basically, the relative layout parent holds within the horizonal scrollable scrollview, within it you have your needed-to-be-scrolled views. After if you define your number view, being inside a relative layout it will simply be ordered above it. You can then center it to appear above your scrollable scrollView.
Do note the following 2 this:
The scroll will only be performed if the user touched the scrollable view. As in, if the user tries to swipe from pressing on the number it self, it will not scroll.
The content behind the number will be hidden behind it, it won't "skip" from 1 side to the other so you can have "invisible" content that way.
I have 2 rows of "buttons" which are composed of a vertical LinearLayout of an ImageView and a TextView. The problem I'm having right now is trying to set the ImageView aspect ratio without hardcoding its dimensions.
I have already tried playing with the layout weights but it still forces the TextView to be partially cut off.
The xml structure I have is 2 horizontal LinearLayouts and each button is described above.
I've included a picture of my problem. You can see the first button is forcing the TextView out of the bounds. The rest of the buttons you see are hardcoded dimensions, but I don't want to do that because smaller screen sizes won't work.
Here is my layout for one button:
<LinearLayout
android:gravity="center_horizontal"
android:layout_weight="1"
android:padding="5dp"
android:orientation="vertical"
android:layout_width="0dip"
android:layout_height="match_parent">
<ImageView
android:id="#+id/setting_img"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:adjustViewBounds="true"
android:background="#null"
android:clickable="true"
android:onClick="openSettings"
android:src="#drawable/menu" />
<TextView
android:id="#+id/setting_text"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Settings"
android:textAlignment="center"
android:textColor="#android:color/white"
android:autoSizeTextType="uniform" />
</LinearLayout>
Try using images with lower dimensions.
Try using a RelativeLayout and setting the TextView as anchor for the image:
<RelativeLayout
android:layout_width="0dip"
android:layout_height="match_parent"
android:layout_weight="1"
android:padding="5dp">
<TextView
android:id="#+id/setting_text"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_alignParentBottom="true"
android:text="Settings"
android:textAlignment="center"
android:textColor="#android:color/white"
android:autoSizeTextType="uniform" />
<ImageView
android:id="#+id/setting_img"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_above="#id/setting_text"
android:scaleType="centerInside"
android:adjustViewBounds="true"
android:background="#null"
android:clickable="true"
android:onClick="openSettings"
android:src="#drawable/menu" />
</RelativeLayout>
i tried creating a small game cards game if the first layout the player chooses the character
but the screen not big enough to fit all the characters "3" i tried to set scrollview horizontally to fill parent then specific amount then wrap content but i'm getting tired
<ScrollView
android:layout_marginTop="35dp"
android:layout_width="650dp"
android:layout_height="wrap_content"
>
<LinearLayout
android:layout_marginTop="40dp"
android:layout_width="650dp"
android:layout_height="350dp"
>
<RadioGroup
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal" >
<RadioButton
android:id="#+id/RBarthu_mage"
android:button="#drawable/user_arthu"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
/>
<RadioButton
android:id="#+id/RBDwemer_fighter"
android:button="#drawable/xuser_dwemer"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="50dp"
/>
<RadioButton
android:id="#+id/RBZombie"
android:button="#drawable/xuser_zombie"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="50dp"
/>
</RadioGroup>
</LinearLayout>
</ScrollView>
In your <LinearLayout change the line
...layout_height="350dp"
to
...layout_height="wrap_content"
Note: And just for good practice, change your width of the <LinearLayout to match_parent.
I am wanting a button to be aligned to the the bottom and right of a EditText box.
My code is below:
<RelativeLayout
android:id="#+id/global_only_available_home_delivery_postcode_check_layout"
android:layout_width="match_parent"
android:orientation="horizontal"
android:layout_marginTop="5dp"
android:layout_gravity="right"
android:layout_height="wrap_content" >
<EditText
android:id="#+id/global_only_available_home_delivery_postcode_check_text_phone"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:hint="#string/delivery_edit_hint"
android:layout_marginLeft="#dimen/pdp_status_delivery_margin_5"
android:layout_marginTop="#dimen/pdp_status_delivery_margin_10"
android:textSize="14sp"
android:inputType="text" />
<Button
android:id="#+id/fragment_pdp_deliverygo"
style="#style/alternatesmallbutton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:minWidth="35dp"
android:minHeight="35dp"
android:layout_marginLeft="10dp"
android:text="#string/pdp_delivery_go"
android:layout_gravity="right"
android:layout_margin="5dp"
android:layout_toRightOf="#+id/global_only_available_home_delivery_postcode_check_text_phone"
android:layout_alignBottom="#+id/global_only_available_home_delivery_postcode_check_text_phone"
android:visibility="visible" />
</RelativeLayout>
and here is what I get button alignment
As you can see from the image, the button doesn't seem to be aligned to the bottom of the textview.
Can anyone help?
This is because you have android:layout_margin="5dp" for the button. This assigns a margin of 5dp to the bottom of the button and it appears as if it is not aligned to the bottom. You should remove it and assign margins individually to other sides if you want eg:
android:layout_marginRight="5dp"
android:layout_marginTop="5dp" // etc (optional)
Try this..
Use android:layout_alignParentRight="true" and android:layout_centerVertical="true"
<Button
android:id="#+id/fragment_pdp_deliverygo"
style="#style/alternatesmallbutton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:minWidth="35dp"
android:minHeight="35dp"
android:layout_marginLeft="10dp"
android:text="#string/pdp_delivery_go"
android:layout_gravity="right"
android:layout_margin="5dp"
android:layout_alignParentRight="true"
android:layout_centerVertical="true"
android:layout_toRightOf="#+id/global_only_available_home_delivery_postcode_check_text_phone"
android:layout_alignBottom="#+id/global_only_available_home_delivery_postcode_check_text_phone"
android:visibility="visible" />
Try using layout_below instead of layout_alignBottom
Please have a look at the following simple code.
<TextView
android:id="#+id/textView1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:text="John Jonathan Samuwell Abbruzzi"
android:singleLine="true"
android:scrollHorizontally="true"
android:textSize="50sp" />
The text in TextView is larger than the width of the screen and should be in single line. I added android:scrollHorizontally="true", so the user can scroll it to see the rest of the text. But, it is not happening. What have I done wrong?
Put your textview inside the HorizontalScrollView its working i am tested..
<HorizontalScrollView
android:layout_width="fill_parent"
android:layout_height="fill_parent" >
<TextView
android:id="#+id/textView1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:text="John Jonathan Samuwell Abbruzzi"
android:singleLine="true"
android:scrollHorizontally="true"
android:textSize="50sp" />
</HorizontalScrollView>
You need to use HorizontalScrollView with single line. If you want horizontal scrollbar for multiple views then you can create layout in HorizontalScrollView and scroll complete. HorizontalScrollView can only hold one direct child.
<HorizontalScrollView
android:id="#+id/horizontalScrollView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="40dp" >
<TextView
android:id="#+id/textView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="91dp"
android:singleLine="true"
android:text="my view" />
</HorizontalScrollView>