Whenever I click on the button it moves in up direction, Like this
After filling the whole layout it behaves normally means if then I remove the text and click again it remains on its position
<Button
android:id="#+id/b1"
android:layout_width="60dp"
android:layout_height="60dp"
android:layout_margin="0dp"
android:background="#drawable/blackborder"
android:gravity="center"
android:stateListAnimator="#null"
app:layout_constraintBaseline_toBaselineOf="#+id/b2"
app:layout_constraintEnd_toStartOf="#+id/b2">
</Button>
<Button
android:id="#+id/b2"
android:layout_width="60dp"
android:layout_height="60dp"
android:layout_margin="0dp"
android:background="#drawable/blackborder"
android:gravity="center"
android:stateListAnimator="#null"
app:layout_constraintBaseline_toBaselineOf="#+id/b3"
app:layout_constraintEnd_toStartOf="#+id/b3"></Button>
if you mean the shadow effects that appear in onClick event, you can remove it by making your background solid transparent.
like the example:
<?xml version="1.0" encoding="utf-8"?>
<shape android:shape="rectangle" xmlns:android="http://schemas.android.com/apk/res/android">
<solid android:color="#android:color/transparent"/>
<stroke android:color="#android:color/black" android:width="1dp"/>
</shape>
This is happening because I used baseline constraint to connect two button placed next to each other but after removing the baseline constraint I got the desired behavior. Now button is remain on its position after a click.
<Button
android:id="#+id/b1"
android:layout_width="50dp"
android:layout_height="50dp"
android:layout_margin="0dp"
android:layout_marginEnd="16dp"
android:layout_marginBottom="16dp"
android:background="#drawable/blackborder"
app:layout_constraintBottom_toTopOf="#+id/b6"
app:layout_constraintEnd_toStartOf="#+id/b2">
</Button>
<Button
android:id="#+id/b2"
android:layout_width="50dp"
android:layout_height="50dp"
android:layout_margin="0dp"
android:layout_marginEnd="16dp"
android:layout_marginBottom="16dp"
android:background="#drawable/blackborder"
app:layout_constraintBottom_toTopOf="#+id/b7"
app:layout_constraintEnd_toStartOf="#+id/b3"></Button>
Related
I have background imageview (green with 3 red circle) and 3 textview (A,B,C).
how can I put textviews exactly on center of red circles that support multi screen devices , portrait/landscape?
Edited:
maybe I asked wrong question.
my main question is:
1- I've an image in my layout for example like this:
2- I want put textview on image in exact positions
when I test on different screen size , position of textviews changed.
Try this
activity_main.xml
<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"
android:background="#00FF00"
android:paddingBottom="#dimen/activity_vertical_margin"
tools:context=".MainActivity">
<TextView
android:id="#+id/num_txt"
android:layout_width="50dp"
android:layout_height="50dp"
android:layout_marginTop="10dp"
android:layout_marginLeft="20dp"
android:background="#drawable/bg_red"
android:gravity="center"
android:text="A"
android:textColor="#000000"
android:textSize="20dp" />
<TextView
android:id="#+id/num_txt2"
android:layout_width="50dp"
android:layout_height="50dp"
android:layout_marginTop="30dp"
android:layout_marginLeft="100dp"
android:background="#drawable/bg_red"
android:gravity="center"
android:text="B"
android:textColor="#000000"
android:textSize="20dp" />
<TextView
android:id="#+id/num_txt3"
android:layout_width="50dp"
android:layout_height="50dp"
android:layout_marginTop="100dp"
android:layout_marginLeft="50dp"
android:background="#drawable/bg_red"
android:gravity="center"
android:text="C"
android:textColor="#000000"
android:textSize="20dp" />
Save in drawable bg_red.xml
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="oval">
<corners android:radius="10dip"/>
<stroke android:color="#FF0000" android:width="5dip"/>
<solid android:color="#FF0000"/>
</shape>
The Output is :
In the text view xml attribute
android:gravity="center"
and make the circle xml file width as warp content
width = "wrap_content"
In My android I want :--
here "Or" is a text view..this textview is surrounded by circle view and a vertical line is passing by the circle..
Here is my code:--
This code is for textview with rounded circle
round.xml in drawable folder:--
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" >
<stroke android:color="#22ff55" android:width="3dip"/>
<corners
android:bottomLeftRadius="30dp"
android:bottomRightRadius="30dp"
android:topLeftRadius="30dp"
android:topRightRadius="30dp" />
<size
android:height="60dp"
android:width="60dp" />
</shape>
and in my layout
I have textviews as:
<TextView
android:id="#+id/tv"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/round_tv"
android:gravity="center_vertical|center_horizontal"
android:text="or"
android:textColor="#000"
android:textSize="20sp" />
and this code for vertical line:--
<View
android:layout_width="1dp"
android:layout_height="match_parent"
android:background="#FF0000FF" />
So I have textview with rounded Circle and a verticle line..
But my problem is how can I join this two codes???
or If my concept is wrong..How can I achieve that thing??????suggest me..
Easiest way is to make the circle and line a .png image, and make it the background for a TextView with the text.
Also, you should avoid using views for dividers (like that line) if at all possible. Views are fairly heavyweight to create and layout all the time. If you have a complex app they'll come back to bite you in performance issues.
As you have done this you can take the Textview and view inside the FrameLayout. FrameLayout will help you show one control over the other
<FrameLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content">
//Put here
</FrameLayout>
You can use a RelativeLayout as the container for all the above views and use it to properly position all the views.
Here's an example to get you started:
<RelativeLayout
android:layout_width="..."
android:layout_height="...">
<Button
android:id="#+id/btnRegister"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true" />
<Button
android:id="#+id/btnLogin"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true" />
<View
android:layout_width="1dp"
android:layout_height="match_parent"
android:layout_centerHorizontal="true"
android:background="#FF0000FF" />
<TextView
android:id="#+id/tv"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/round_tv"
android:layout_centerInParent="true"
android:text="or"
android:textColor="#000"
android:textSize="20sp" />
</RelativeLayout>
I am trying to develop a filter using following ways. I can not find red highlighted View in android. How can I achieve this.
Any help would be appreciated.
Check this:
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="78dp"
android:layout_gravity="center"
android:layout_marginTop="0dp"
android:background="#CCDEF6" >
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="70dp"
android:background="#FFFFFF"
android:layout_centerInParent="true"
android:layout_marginRight="4dp"
android:layout_marginLeft="4dp" >
<Button
android:id="#+id/delete"
android:layout_width="45dp"
android:layout_height="45dp"
android:layout_alignParentRight="true"
android:layout_centerVertical="true"
android:layout_marginRight="05dp"
android:background="#drawable/icn_edit_45x45"
android:textColor="#FFFFFF" />
<Button
android:id="#+id/edit"
android:layout_width="45dp"
android:layout_height="45dp"
android:layout_centerVertical="true"
android:layout_marginRight="18dp"
android:layout_toLeftOf="#+id/delete"
android:background="#drawable/icn_delete_45x45"
android:textColor="#FFFFFF" />
</RelativeLayout>
</RelativeLayout>
Make this xml in your drawable :
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle" >
<solid android:color="#android:color/transparent" />
<stroke
android:width="2dip"
android:color="#007f00" />
</shape>
After making this set it background to your bustype below layout.
You don't need to implement any custom view.
1) First include that AC-NON_AC layout to a relative layout with padding eg.5dp .
2) Then set background of relative layout #FF0000 i.e. Red color.
If any problem persists , ask me .I will help you.
Hello guys i know this is not a new question. I am getting help from HERE. In which i have success to make circle button with plane background but i want to make a button with background image like this:
Here is related code for the layout:
<LinearLayout
android:id="#+id/viewLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<View
android:layout_width="0dp"
android:layout_height="2dp"
android:layout_weight="1"
android:layout_gravity="center_vertical"
android:background="#color/lighter_gray"/>
<Button
android:id="#+id/btnEdit"
android:background="#drawable/button_circular"
android:ellipsize="none"
android:layout_width="0dp"
android:layout_weight=".18"
android:layout_height="wrap_content" />
<View
android:layout_width="0dp"
android:layout_height="2dp"
android:layout_weight="0.2"
android:layout_gravity="center_vertical"
android:background="#color/lighter_gray"/>
</LinearLayout>
#drawable/button_circular
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="oval">
<solid android:color="#color/app_main_color"/>
<stroke android:width="2dp" android:color="#color/app_main_color" />
</shape>
I also want to know is this a right way to get button like this? Thanks in advance.
You should use Imageview Instead of Button
<ImageView
android:id="#+id/btnEdit"
android:background="#drawable/button_circular"
android:ellipsize="none"
android:layout_width="0dp"
android:layout_weight=".18"
android:layout_height="wrap_content" />
If I want to get a look as below, what do I do? More specifically, how do I set the white background around multiple items?
EDIT:
The grey is the background for the whole screen, and the white is like a "box" placed on the grey background, together with the buttons, divider and textview.
I'm thinking like this:
<TableLayout
android:background="#eae8e8>
...
<WhiteBox
android:layout_width="fill_parent"
android:layout_height="300dp"
android:layout_margin="16dp"
android:background="#FFFFFF/>
<TextView>
...
<Divider>
...
<Button>
...
<Button>
...
</WhiteBox>
</TableLayout>
Where "WhiteBox" of course is something else, but would it be possible to do something like this?
I would recommend leaving as many of the elements as possible transparent to prevent overdraw issues but it depends on your overall needs. By using #null backgrounds you can change the base background element and everything drawn over it would change accordingly (true transparent).
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:background="#color/white"
android:padding="10dp">
<EditText
android:id="#+id/editText1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#null"
android:ems="10"
android:gravity="center"
android:inputType="text"
android:text="Test"
android:textColor="#CCC" >
<requestFocus />
</EditText>
<View
android:id="#+id/divider"
android:layout_below="#+id/editText1"
android:layout_width="match_parent"
android:layout_height="1dp"
android:background="#CCC" />
<LinearLayout
android:id="#+id/buttons"
android:layout_marginTop="10dp"
android:layout_below="#+id/divider"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal" >
<Button
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight=".5"
android:background="#drawable/testbutton"
android:text="BUTTON 1"
android:textColor="#CCC" />
<Button
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight=".5"
android:background="#drawable/testbutton"
android:text="BUTTON 2"
android:textColor="#CCC" />
</LinearLayout>
</RelativeLayout>
Button style
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_pressed="true">
<shape>
<solid android:color="#null" />
<stroke android:width="1dp" android:color="#CCC" />
</shape>
</item>
<item>
<shape>
<solid android:color="#null" />
<stroke android:width="1dp" android:color="#CCC" />
</shape>
</item>
</selector>
Yes you can go ahead with your approach.just give margin to your inner layout to which your background is set to white.and you can also set the background to white for the text views and buttons you are using inside your inner layout.Set the text color as gray for text view and button.eg:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#eae8e8">
<RelativeLayout
android:layout_width="200dp"
android:layout_margin="30dp"
android:layout_height="200dp"
android:background="#FFFFFF"
>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/text"
android:layout_margin="50dp"
android:text="TextView"
android:textColor="#android:color/darker_gray"
android:background="#FFFFFF"
/>
<Button
android:layout_marginTop="20dip"
android:text="Button"
android:textColor="#android:color/darker_gray"
android:layout_below="#+id/text"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/button1"
android:background="#FFFFFF"
/>
</RelativeLayout>
</LinearLayout>
By default when you create an xml with no backgrounds applied to your parent layout and if the widgets inside also does not have any background image/color set.it renders white on the screen.Just don't add any image/color as background.You can also set the background as white.
android:background="#FFFFFF" set this to your widgets in xml. like button or text view etc to have it appear white.