Button to be focussed & in default selected condition - android

I am displaying a the Terms & Conditions screen of the mobile application as the first screen.
I am using a layout file to display the screen.
Within the layout file , I have two buttons , one for Accept & one for Reject
<Button android:id="#+id/acceptBtn" android:text="#string/accept"
android:background="#drawable/buttons" android:textColor="#color/white"
android:layout_width="wrap_content" android:layout_height="wrap_content"></Button>
<Button android:id="#+id/rejecttBtn" android:text="#string/reject"
android:background="#drawable/buttons" android:textColor="#color/white"
android:layout_width="wrap_content" android:layout_height="wrap_content"></Button>
The requirement by default is , the Reject button should be in selected condition. Also , currently , because of the android:background="#drawable/buttons" which is an image , the buttons are not getting focussed.
Kindly provide your inputs/sample code/xml to solve the issue.
Thanks in advance.

The problem is that the focus indicator on a button is nothing more than a background image. So when you set your background with a drawable you prohibit the system to use the focused background image when the button changes its state.
A simple solution is to use ImageButtons and to set your drawable as the src attribute. Then you have a button with your image in the center. The underlying background can change to the default focus background image. If you don't want the grey area underneath your image and still want to use buttons you would have to define customs styles depending on the state of the button. Please have a look in this similar post: Remove focus border of EditText
There I already explained this scenario.

Related

How to set a background Image to a Button BUT STILL WORKS LIKE A NORMAL BUTTON (With Effects)?

I have been trying to achieve the Normal android button effects when the button is already set with a background image
But the problem is, once the background is set, the button default nature is gone (shadows, clickable animation etc..)
Can Someone please give me a working solutions for this?
Here's the code to my button
<Button style="#style/Widget.AppCompat.Button.Colored"
android:id="#+id/student"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/student"
android:layout_marginRight="8dp"
app:layout_constraintRight_toRightOf="parent"
android:layout_marginLeft="8dp"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintBottom_toBottomOf="parent"
android:layout_marginBottom="8dp"
app:layout_constraintTop_toTopOf="parent"
android:layout_marginTop="8dp"
app:layout_constraintVertical_bias="0.891" />
It looks amazing since I have set a background image but It still looks like you have set an image to a jLabel in Java)
How can I get the default button looks while keeping my background image intact?
Button works by setting the background to a background with the elevation, shadows, ripple, etc. To get the same behavior, you're going to need to set your background to a StateListDrawable that performs the ripple effect and puts the shadows and elevation effects with your image as the background inside of all that. You can't just set the background to be your image, that will lose all of those features. The easiest way to get that right is to look at the AOSP source code and find the drawable it uses, copy it to your project, and edit appropriately.
Basically in Android a Button is just a TextView with a special background preset.
Why don't you use ImageButton widget ? It has the same behaviour as a Button and ImageView combined
Check this tutorial to see how to work with it.
as mentionned in the official documentation
Displays a button with an image (instead of text) that can be pressed or clicked by the user. By default, an ImageButton looks like a regular Button, with the standard button background that changes color during different button states. The image on the surface of the button is defined either by the android:src attribute in the XML element or by the ImageView.setImageResource(int) method

how to achieve Google Play Music-like button look in my app?

Hi I have been inspired by a Google Music app and been trying to achieve the same effect on the button when it is pressed. The shot will help u understand:
SO here the button gets that semi-transparent nice-looking effect. Unfortunately, i ve gone nowhere with it, i just managed to similar button but now it doesnt change color when i press it? Im really stuck and need help, im a novice in android dev, i have been trying selectors but when I set a selector to button background the app fails at runtime.
Here is a screenshot of my button:
For this button, to achieve the shadow I used the card_background.9.png file so it also changes the whole button background to white. I assume what is why the button looses the default pressed state.
XML code for the button:
<Button
android:id="#+id/btn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Facebook"
android:drawableLeft="#drawable/facebook_icon"
android:background="#drawable/card_background"
android:padding="15dp"
android:textSize="20sp"
android:drawablePadding="10dp"
/>
You can create your custom button with creating a custom style. In this style you can define different images for different button states (for example enabled, pressed...). Take a look at this tutorial.

Android SDK: Button becomes colored when changing the background color on LinearLayout

I have a LinearLayout in an Android app I am creating now which contains a default button with gradient gray color. This LinearLayout is now white but when I try to change the background color to yellow the button also becomes yellow which I don't want to happen. I also tried to use a color image to set the background color on the LinearLayout but the same thing happens. How do I solve this problem? Here is the code:
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:orientation="horizontal"
android:background="#color/yellow">
<Button
android:id="#+id/buttonCart"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Button"/>
</LinearLayout>
SOLVED: Wait, it actually works now. while the buttons become colored and transparent in the layout view in Eclipse the buttons is unaffected when I run the app on the phone. I thought that it would display the same result when the app is runned. Strange how it become that way in the layout view...
In that case you may set a gray background color android:background="#A4A4A4" for button also..
Just set the background on your button separately. You can use a state list drawable, i.e. a different background for each state of the button (pressed, focused, etc) to make it compeletely custom.
Why the background color changes with the layout I'm not sure. It sounds like your button is default to transparant. Check your style and theme to make sure that's not affecting what's displayed.

Creating header with home page(Landing screen) button

One of the application in my mobile has a header like the one shown below in the snapshot. I like the design very much and would like to create one for my application. Clicking the home icon takes the user to landing page(Home page). I have only created buttons of squarish and rounder corners. But not sure, how to create one like the one given below. Any help would be highly appreciated.
Create the image in photoshop or whatever.
Then create an imageview and let it act like a button:
<ImageView
android:id="#+id/camera_button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/button_camera"
android:onClick="onCameraButtonClick" />
onClick is introduced in Android 1.6
or a button and set the background:
<Button
android:id="#+id/camera_button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/button_camera"
android:onClick="onCameraButtonClick" />
drawable/camera_button should be a state drawable so the user can see when it is being clicked/focused.
in your activity:
public void onCameraButtonClick(View v){
// Do Something
}
It's all here:
http://developer.android.com/reference/android/widget/Button.html
The way that I would do this is just create the buttons in photoshop/GIMP on the same canvas then save each as PNG, you can use the slice tool for this. Then I would just add an attributes to each button. There's attributes that let you set the left margin of say the right button to line up with the right margin of the left button. The backgrounds of the buttons could also be patch9 images, and the icons inside it could be the src attribute of the button view. The button with the camera would have SRC pointing to a PNG that has the camera icon as well as "Camera". And the button itself not having any text.

Removing Android ToggleButton's green indicator light

I would like my app to have a day of week selector with multiple day selection capability. I'm using ToggleButtons for this right now, but because of the indicator lights a ToggleButton takes too much space on the screen. Without the lights, my ToggleButtons would look like normal (toggleable) Buttons and they could fit in one row. How can I hide the lights?
The answer is this part:
android:background="#android:drawable/btn_default"
For example, following will make the light disappear and toggle button would look like a default button, but with the toggle functionality:
<ToggleButton android:id="#+id/your_btn"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:textOn="On" android:textOff="Off"
android:background="#android:drawable/btn_default" />
You can use a custom android:background drawable for them, that will override the graphics including the indicator light. If you look at Android: using framework drawables in custom button selector, there's instructions for copying resources from the SDK to your own project. You presumably could copy the platform normal button drawable and use that as your background.

Categories

Resources