Radius corners of views in xml - android

I have an Android calculator app that I'm working on and I want to make the text view corners radius and there is two text views I want to appear to be one so I need to only round 2 corners on the outside edge of the views. Here is my main.xml
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:orientation="horizontal" >
<TextView
android:id="#+id/question"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_marginBottom="3dp"
android:layout_marginLeft="2dp"
android:layout_marginTop="3dp"
android:layout_weight="1"
android:gravity="center|right"
android:padding="5dp"
android:text="0 + 0"
android:textColor="#ff333333"
android:textSize="30sp" />
<TextView
android:id="#+id/answer"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_marginBottom="3dp"
android:layout_marginRight="2dp"
android:layout_marginTop="3dp"
android:layout_weight="1"
android:gravity="center|left"
android:padding="5dp"
android:text="= ?"
android:textColor="#ff333333"
android:textSize="30sp" />
<Button
android:id="#+id/clear"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_margin="1dp"
android:layout_weight="1"
android:background="#drawable/enter_back"
android:gravity="center"
android:padding="5dp"
android:text="C"
android:textColor="#ff333333"
android:textSize="30sp"
android:textStyle="bold" />
</LinearLayout>

You can do this by adding 3 new android xml files to your drawable folder then setting them as background in your main.xml file. to the right views
android:background="#drawable/answer_back" to the main.xml view # id="#+id/answer"
answer_back.xml to radius the right side corners:
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:dither="true" >
<gradient
android:angle="90"
android:endColor="#ffffffff"
android:startColor="#ff99ffcc" />
<corners
android:bottomRightRadius="20dp"
android:topRightRadius="20dp"/>
</shape>
android:background="#drawable/question_back" to the main.xml view # id="#+id/question"
question_back.xml to radius the left side corners:
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:dither="true" >
<gradient
android:angle="90"
android:endColor="#ffffffff"
android:startColor="#ff99ffcc" />
<corners
android:bottomLeftRadius="20dp"
android:topLeftRadius="20dp"/>
</shape>
android:background="#drawable/num_back" to the main.xml view # all the button views
num_back.xml to set the radius of all corners
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:dither="true" >
<gradient
android:angle="90"
android:endColor="#ffffffff"
android:startColor="#ff99ffcc" />
<corners<corners android:radius="20dp" />
</shape>

Related

Custom divider not working in Linear layout

I want to change the color of my Divider for that I am following solution : Change the color of divider in LinearLayout. but my divider not showning
Code :
<LinearLayout
android:layout_width="match_parent"
android:layout_height="48dp"
android:orientation="horizontal"
android:divider="#drawable/devider"
android:dividerPadding="12dip"
android:showDividers="middle"
android:layout_gravity="center"
android:gravity="center"
android:background="?android:selectableItemBackground"
>
<TextView
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:id="#+id/textview2"
android:layout_gravity="center"
android:gravity="center"
android:background="?android:selectableItemBackground"
android:text="This is demo of Boderless Button"
android:textColor="#2d2d2d"
android:textSize="20dp"
/>
<ImageButton
style="?android:borderlessButtonStyle"
android:src="#drawable/ic_datarecord"
android:layout_width="wrap_content"
android:id="#+id/imageButton2"
android:layout_height="wrap_content" />
</LinearLayout>
Divide Drawable :
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<size android:width="5dip" />
<solid android:color="#f00" />
</selector>
observed thing : if I use android:divider="?android:dividerVertical" then divider is working
Use this in your drawable xml like following
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
<size android:width="5dip" />
<solid android:color="#f00" />
</shape>

adding custom border drawable to android RelativeLayout not showing - Xamarin Forms

I'm trying to add a background rectangle shape to a custom RelativeLayout in android and I'm following the recommendations of most questions on here by implementing a custom drawable in customborder.xml and setting it as the background of the custom.axml view. I have also tried setting the relativeLayout source as well.
You can see I've also tried it in an imageView which isn't showing up either.
I've messed around with size and color but nothing appears to be rendered.
Am I missing something that needs to be done in code? Or the xml?
customborder.xml:
<?xml version="1.0" encoding="UTF-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
shape="rectangle">
<corners radius="20dp"/>
<padding left="50dp" right="50dp" top="50dp" bottom="50dp"/>
<stroke width="10dp" color="#B2F7FE"/>
<solid color="white"/>
</shape>
custom.axml:
<?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:padding="8dp"
android:background="#drawable/customborder">
<ImageView
android:id="#+id/imageViewBackground"
android:layout_width="fill_parent"
android:layout_height="49.0dp"
android:layout_gravity="center"
android:background="#ffededed"
android:adjustViewBounds="false"
android:alpha="1"
android:backgroundTint="#00000000"
android:foreground="#drawable/customborder" />
<refractored.controls.CircleImageView
android:id="#+id/Image"
android:layout_width="50dp"
android:layout_height="50dp"
android:layout_gravity="center"
android:src="#drawable/icon" />
<LinearLayout
android:id="#+id/Text"
android:orientation="vertical"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="left"
android:paddingLeft="10dip"
android:layout_marginLeft="10.5dp"
android:background="#drawable/customborder">
<TextView
android:id="#+id/Text2"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:textSize="24dip"
android:textColor="#FFFFFFFF"
android:paddingLeft="5dip"
android:text="Test"
android:layout_marginLeft="46.0dp"
android:layout_marginTop="12.0dp"
android:layout_gravity="left" />
<TextView
android:id="#+id/Text1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="#FF7F3300"
android:textSize="20dip"
android:textStyle="italic" />
</LinearLayout>
Please replace your customborder.xml file with following code,
<?xml version="1.0" encoding="UTF-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<corners
android:bottomLeftRadius="20dp"
android:bottomRightRadius="20dp"
android:topLeftRadius="20dp"
android:topRightRadius="20dp" />
<padding
android:bottom="50dp"
android:left="50dp"
android:right="50dp"
android:top="50dp" />
<stroke android:width="10dp" android:color="#B2F7FE"/>
<solid android:color="#ffffff" />
</shape>
Your mistake was android prefix is missing.Also you are missing close tag in your layout.

Android layout design

I'm sorry if I asking a stupid question here.
I'm looking for android layout design. Is there has a web easy for us to design the android layout and finally generate xml code to android studio.
I wanted to have a layout design as image below, however I don't think it is possible to do using android studio layout.
Try this xml code..
Screenshot
<?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:padding="#dimen/value_10"
android:orientation="vertical">
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<TextView
android:id="#+id/title1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/round_corner_up"
android:padding="#dimen/value_10"
android:text="Choose Station"
android:textColor="#color/black"
android:textSize="#dimen/txt_large" />
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/title1"
android:layout_marginTop="-15dp"
android:background="#drawable/round_corner_up">
<EditText
android:layout_width="350dp"
android:layout_height="70dp"
android:layout_margin="#dimen/value_10"
android:background="#drawable/round_corner_square" />
</LinearLayout>
</RelativeLayout>
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:paddingTop="#dimen/value_10">
<TextView
android:id="#+id/title2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/round_corner_up"
android:padding="#dimen/value_10"
android:text="Within Next"
android:textColor="#color/black"
android:textSize="#dimen/txt_large" />
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/title2"
android:layout_marginTop="-15dp"
android:background="#drawable/round_corner_up">
<Spinner
android:layout_width="350dp"
android:layout_height="70dp"></Spinner>
</LinearLayout>
</RelativeLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:paddingTop="#dimen/value_20"
android:orientation="horizontal">
<Button
android:layout_width="0dp"
android:layout_weight="1"
android:text="Arrivals"
android:textSize="20sp"
android:drawableLeft="#drawable/drawable1"
android:layout_height="#dimen/value_70" />
<Button
android:layout_width="0dp"
android:layout_weight="1"
android:text="Departures"
android:textSize="20sp"
android:drawableLeft="#drawable/drawable2"
android:layout_height="#dimen/value_70" />
</LinearLayout>
round_corner_up.xml
<?xml version="1.0" encoding="utf-8"?><!-- res/drawable/rounded_edittext.xml -->
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:padding="10dp"
android:shape="rectangle">
<solid android:color="#7B7D7B" />
<stroke
android:width="3dip"
android:color="#7B7D7B" />
<corners
android:bottomLeftRadius="10dp"
android:bottomRightRadius="10dp"
android:topLeftRadius="10dp"
android:topRightRadius="10dp" />
round_corner_square.xml
<?xml version="1.0" encoding="utf-8"?><!-- res/drawable/rounded_edittext.xml -->
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:padding="10dp"
android:shape="rectangle">
<solid android:color="#color/white" />
<stroke
android:width="3dip"
android:color="#color/light_gray" />
<corners
android:bottomLeftRadius="15dp"
android:bottomRightRadius="15dp"
android:topLeftRadius="15dp"
android:topRightRadius="15dp" />
You need to divide the layout in smaller elements. e.g. Choose station will be a TextView having a background image and text on it "Choose Station". Below that there will be a Relativelayout with image background and a EditText. There will be a search button with magnifying glass as background drawable. This will be aligned to right of parent so that it be on top of Edittext.

state_pressed event is setting background on wrong button while click

I use Buttons inside Linear Layout, Table Row and Table Layout, maybe this has some influence.
The problem is that state_pressed doesn't work properly. When I'm pressing Button A/B/C/D, Android is selecting Button D (it is slightly darker).
You can see on the image, that shadow works properly, but the background is setting always on the wrong button D (bottom right corner).
After clicking any button I change its background programmatically and set backgrounds to red or green. It works properly.
The red button is selecting, because our opponent selects this answer. It's setting programmatically and don't have any influence for my bug.
Here is my layout code
<TableLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/rozgrywka"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_below="#+id/icon2"
android:background="#ffffffff"
android:padding="5dp"
android:weightSum="1">
<TableRow
android:layout_width="fill_parent"
android:layout_weight="0.5">
<LinearLayout
android:id="#+id/first"
android:layout_height="fill_parent"
android:layout_weight="1">
<Button
android:id="#+id/buttonA"
android:layout_width="50dp"
android:layout_height="fill_parent"
android:layout_column="1"
android:layout_margin="5dp"
android:layout_weight=".5"
android:background="#drawable/rozgrywkabutton"
android:gravity="center_vertical|center_horizontal"
android:onClick="odpA"
android:text="A"
android:textAlignment="center"
android:textColor="#ff141414"
android:textSize="14dp" />
<Button
android:id="#+id/buttonC"
android:layout_width="50dp"
android:layout_height="fill_parent"
android:layout_column="2"
android:layout_margin="5dp"
android:layout_weight=".5"
android:background="#drawable/rozgrywkabutton"
android:gravity="center_vertical|center_horizontal"
android:onClick="odpC"
android:text="C"
android:textAlignment="center"
android:textColor="#ff141414"
android:textSize="14dp" />
</LinearLayout>
</TableRow>
<TableRow
android:layout_weight="0.5">
<LinearLayout
android:layout_height="fill_parent"
android:layout_alignStart="#id/first"
android:layout_weight="1"
android:id="#+id/second">
<Button
android:id="#+id/buttonB"
android:layout_width="50dp"
android:layout_height="fill_parent"
android:layout_column="2"
android:layout_margin="5dp"
android:layout_weight=".5"
android:background="#drawable/rozgrywkabutton"
android:gravity="center_vertical|center_horizontal"
android:onClick="odpB"
android:text="B"
android:textAlignment="center"
android:textColor="#ff141414"
android:textSize="14dp" />
<Button
android:id="#+id/buttonD"
android:layout_width="50dp"
android:layout_height="fill_parent"
android:layout_column="1"
android:layout_margin="5dp"
android:layout_weight=".5"
android:background="#drawable/rozgrywkabutton"
android:gravity="center_vertical|center_horizontal"
android:onClick="odpD"
android:text="D"
android:textAlignment="center"
android:textColor="#ff141414"
android:textSize="14dp" />
</LinearLayout>
</TableRow>
</TableLayout>
drawable rozgrywkabutton.xml
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android" >
<item android:state_pressed="true" >
<shape android:shape="rectangle" >
<corners android:radius="5dp" />
<stroke android:width="1dip" android:color="#c7c7c7" />
<gradient android:angle="-90" android:startColor="#d3ced3" android:endColor="#b6b2b6" />
</shape>
</item>
<item android:state_focused="true">
<shape android:shape="rectangle" >
<corners android:radius="5dp" />
<stroke android:width="1dip" android:color="#5e7974" />
<solid android:color="#58857e"/>
</shape>
</item>
<item >
<shape android:shape="rectangle" >
<corners android:radius="5dp" />
<stroke android:width="1dip" android:color="#c7c7c7" />
<gradient android:angle="-90" android:startColor="#e4e4e4" android:endColor="#cbc7cb" />
</shape>
</item>
</selector>
I was using static function to make button default.
public static void setBacground(Button buttonA, Drawable draw) {
int sdk = android.os.Build.VERSION.SDK_INT;
if(sdk < android.os.Build.VERSION_CODES.JELLY_BEAN) {
buttonA.setBackgroundDrawable( draw);
} else {
buttonA.setBackground( draw);
}
}
and in my function which make my button look default
Drawable defualt = getResources().getDrawable(R.drawable.rozgrywkabutton);
Global.setBacground(ButtonA, defualt);
Global.setBacground(ButtonB, defualt);
Global.setBacground(ButtonC, defualt);
Global.setBacground(ButtonD, defualt);
when i change this to
Global.setBacground(ButtonA, getResources().getDrawable(R.drawable.rozgrywkabutton));
Global.setBacground(ButtonB, getResources().getDrawable(R.drawable.rozgrywkabutton));
Global.setBacground(ButtonC, getResources().getDrawable(R.drawable.rozgrywkabutton));
Global.setBacground(ButtonD, getResources().getDrawable(R.drawable.rozgrywkabutton));
everything start work properly. Thanks for your time.

Trying to space items in a ListView while using adapter and drawable. Margin is not working

I am trying to have a listview where items have rounded corners and the items are spaced out from each other. This is done using a custom ArrayAdapter.
MyCustomAdapter arrAdapter = new MyCustomAdapter();
setListAdapter(arrAdapter);
I am using a drawable image to round the corners
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle" >
<corners android:radius="10dp" />
<gradient
android:angle="90"
android:endColor="#993333"
android:startColor="#ffffff"
android:type="sweep" />
<solid android:color="#ffffff" />
<stroke
android:width="1dp"
android:color="#000000" />
</shape>
and setting it in the layout as background to the top most container - the LinearLayout
<?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="wrap_content"
android:layout_margin="4dp"
android:background="#drawable/square"
android:orientation="horizontal" >
<TextView
android:id="#+id/routeTag"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="5dp"
android:background="#drawable/circle"
android:padding="10dp"
android:text="text"
android:textAppearance="?android:attr/textAppearanceLarge" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content" >
<TextView
android:id="#+id/stop"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:padding="5dp"
android:text="some text"
android:textAppearance="?android:attr/textAppearanceMedium"
android:textSize="14sp" />
<TextView
android:id="#+id/stopD"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:padding="5dp"
android:text="(text)"
android:textColor="#777777"
android:textSize="10sp" />
</RelativeLayout>
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content" >
<TextView
android:id="#+id/nextTT"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:paddingBottom="5dp"
android:paddingLeft="5dp"
android:paddingRight="9dp"
android:paddingTop="5dp"
android:text="text"
android:textAppearance="?android:attr/textAppearanceMedium"
android:textSize="14sp" />
<TextView
android:id="#+id/moreTT"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_toRightOf="#id/nextTrainTime"
android:paddingBottom="5dp"
android:text="text"
android:textAppearance="?android:attr/textAppearanceMedium"
android:textSize="12sp" />
</RelativeLayout>
</LinearLayout>
</LinearLayout>
For some reason in the graphical display I am able to see that single element exactly as I want it - with margins all around (I also want it to move away from the edges of the screen left and right).
But when I run this and let the adapter do its job I am getting a list of items, touching the sides of the screen and no space between them apart forma single line which is used to separate the items on a normal list.
Anyone have a clue how to make it behave?! I have search far and wide.
Thanks for your help
The space between your item and widescreen can be done with:
<?xml version="1.0" encoding="UTF-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item android:left="10dp"
android:right="10dp"
android:top="10dp"
android:bottom="10dp">
<shape android:shape="rectangle">...</shape>
</item>
In my case I used android:divider and android:dividerHeight on a ListView block to seperate each element of a ListView, and the left-right space with the android:left android:right properties.
The post where I got the info was this

Categories

Resources