Change the Drawable position inside the button - android

<Button
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="32px"
android:layout_marginTop="32px"
android:layout_marginRight="32px"
android:background="#44C4C5"
android:drawableEnd="#drawable/ic_ON"
android:gravity="center"
android:text="ON"
android:textFontWeight="300"
android:textSize="32px"></Button>
If the Button is off, android drawable should change to android:drawableLeft= "#drawable/ic_Off" and text is OFF.
If the Button is On, android drawable should change to android:drawableEnd="#drawable/ic_ON" and text is ON.

Create a custom layout for this, where there is an ImageView to the left and right hand side of a TextView. You can then set the visibility of the left/ right ImageViews programmatically based on whether the button is in the ON or OFF state.
on_off_button.xml:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:background="#44C4C5">
<ImageView
android:id="#+id/offImageView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/ic_OFF"/>
<TextView
android:id="#+id/onOffTextView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="ON"
android:textFontWeight="300"
android:textSize="32sp"/>
<ImageView
android:id="#+id/onImageView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/ic_ON"/>
</LinearLayout>
In your layout file where you want the button to be:
...
<include
android:id="#+id/onOffButton"
layout="#layout/on_off_button"/>
...
In your activity or fragment then you will need to get a reference to the button with findViewById<View>(R.id.onOffButton) and set up an on click listener to set the visibility of the offImageView or onImageView based on the state.

Related

how to display textview below button in relativeLayout

in the below xml layout, i have two buttons at the same position and they will do their function based on the visibilty set. now i tried to place two textviews
below the buttons, i want the text views to be below both buttons so I used
android:layout_below="#id/actConnect2_btn_connect"
but at run time when the connect-button is visible the text view appears below it, and if pair-button is visible it overlap
how to display the textview below both buttons?
Note: i know that i can use android:layout:marginTop but i want to solve it without it
code:
<Button
android:id="#+id/actConnect2_btn_pair"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#id/actConnect2_tv_label_devClass"
android:layout_centerInParent="true"
android:text="#string/str_pair"/>
<Button
android:id="#+id/actConnect2_btn_connect"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="#string/str_connect"
android:layout_below="#+id/actConnect2_tv_label_devClass"
android:layout_alignParentStart="true" />
<TextView
android:id="#+id/actConnect2_tv_label_uuids"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#id/actConnect2_btn_connect"
android:text="Service's UUID: ">
</TextView>
<TextView
android:id="#+id/actConnect2_tv_uuids"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#id/actConnect2_tv_label_uuids">
</TextView>
Put both buttons in a LinearLayout then put the textview below the LinearLayout
take both button in one layout
<RelativeLayout android:id="#+id/relativeButton"
android:layout_width="wrap_content"
android:layout_below="#id/actConnect2_tv_label_devClass"
android:layout_height="wrap_content">
<Button
android:id="#+id/actConnect2_btn_pair"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:text="#string/str_pair"/>
<Button
android:id="#+id/actConnect2_btn_connect"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="#string/str_connect"
android:layout_alignParentStart="true" />
</RelativeLayout>
and use this for your textview
android:layout_below="#id/relativeButton"
You have to place the buttons in a Layout (any type and arrange them accordingly)
Assign an ID to that layout.
Place the textView below that layout ID.

Button color changed due to background color

I changed background color of my activity using android:background. Background color changes but color of button background changes too. I want to keep button with default background and properties.
Button looks like as shown in this image.
XML file of Activity is below
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical"
android:background="#116493">
<Button
android:id="#+id/button1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
style="?android:attr/buttonStyleSmall"
android:text="Button" />
</LinearLayout>
#Nimit Aggarwal: Please update your theme settings . Remove style="?android:attr/buttonStyleSmall" .
Add button
<Button
android:id="#+id/button1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/your_image"
android:text="Button" />
For demo purpose please follow Android ImageButton selector example

How to create a button on top of ImageView and align it to the bottom of the screen?

I want to have a button on top of ImageView using my xml file. When I run this code, the button appears to the left hand side of the screen on top of other buttons.
Does anyone have any idea on what to do to have a button on TOP of ImageView but at the bottom of the screen.
So far I have the following:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
......
<ImageView
android:id="#+id/filter_image_view"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_toRightOf="#id/filter_linear_layout" />
//this is the button I want to have on top of the ImageView
<Button
android:id="#+id/display_RGB"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:background="#drawable/button_blue_red_transluscent"
android:text="#string/display_RGB"
android:textColor="#android:color/white" />
</RelativeLayout>
Not too fussy as long as its somewhere at the bottom of the screen but in the center.
You can put them in their own RelativeLayout, then you can manipulate the location of the button relative to the ImageView quite easily.
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_toRightOf="#id/filter_linear_layout" >
<ImageView
android:id="#+id/filter_image_view"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
/>
<Button
android:id="#+id/display_RGB"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/button_blue_red_transluscent"
android:text="#string/display_RGB"
android:textColor="#android:color/white"
android:layout_centerHorizontal="true"
android:layout_below="#id/filter_image_view"
/>
</RelativeLayout>
If this is not what you are looking, you'll need to post a sample image of how it currently looks and how you wants it to look.
[Edit]
Edited the XML layout. If you want the ImageView to center horizontally, add this to ImageView:
android:layout_centerHorizontal="true"
And you'll probably want to add some spacing between ImageView and Button by adding this to Button:
android:layout_marginTop="8dp"
Try this.
<Button
android:id="#+id/imageButton1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#color/white"
android:padding="16dip"
android:text="hi"
android:textColor="#color/black"
/>

How to create an overlay view in Android which toggles on button click

I want to create and overlay view when a button is clicked. Something like clicking smileys button in Whatsapp.
I have created a framelayout with default visibility as GONE and added an onclick listener on smiley button to toggle its visibility.
My layout XML:
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_alignParentRight="true" >
<ImageView
android:id="#+id/smileyButton"
android:layout_width="24dip"
android:layout_height="48dip"
android:layout_alignParentRight="true"
android:layout_alignParentTop="true"
android:contentDescription="#string/contactIconContentDescription"
android:src="#drawable/emo_im_happy" />
<FrameLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/smileyButton" >
<TextView
android:id="#+id/chat_smiley_list"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="#android:color/white" />
</FrameLayout>
</RelativeLayout>
I have added onClickListener to smileyButton which toggles visibility of chat_smiley_list.
Other than some positioning problems, I am not sure whether this is the best way to do it.
I think you could use a Context Menu: documentation

Set an ImageView outside the screen with a LinearLayout

I'm developing an Android 2.2 application.
I have a linearlayout with a textview, a button and an ImageView.
I want to set this imageview outside of the screen and set an animation to move it from left to right.
I want to simulate a ship moving from left to right. The user will see it appears from left side of the screen and disappears from right side.
I know I can use AbsoluteLayout to set a layout_x for ImageView, but I don't want to set layout_x and layout_y for the others views (textview and button), because they are centred on the screen.
This is how I have solved my problem:
<?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="fill_parent"
android:orientation="vertical">
<TextView
android:id="#+id/appNameTextView"
android:text="#string/app_name"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_marginTop="40px"/>
<Button
android:id="#+id/PlayButton"
android:text="#string/play"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_marginTop="40px"/>
<AbsoluteLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
xmlns:android="http://schemas.android.com/apk/res/android">
<ImageView
android:id="#+id/greekShip"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/picture"
android:maxWidth="176px"
android:maxHeight="87px"
android:layout_x="-200px"/>
</AbsoluteLayout>
</LinearLayout>

Categories

Resources