I am designing an android user interface I am facing some problem in designing it can anybody guide me.
I need UI same as the above where there is not space between 2 EditText.
Regards
Altaf
You need to change its background. The default Android EditText has padding because of its background.
Here's the EditText's background xml description:
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_focused="true"
android:drawable="#drawable/editbox_background_focus_yellow"/>
<item android:drawable="#drawable/editbox_background_normal"/>
</selector>
Just provide image for these states, create a similar drawable xml file in your project and you'll be able to change how EditTexts look like.
You need to set the background to either your own drawable or a color. Try setting the background of each EditText to #FFFFFFFF, and make sure there are no margins set. That will cause them to be flush next to each other.
For the grey separator between the 2, add a View (just plain View) with layout_height of 1dp and layout_width of fill_parent between the two EditTexts. Then set the background color of that to #FF868686.
Related
I'm trying to customize the letter popup that appears during scroll. I was able to change it's colors and the position from my styles, but I need to make the text and the whole element bigger as well as move it closer to the vertical center of the screen. Is any of these things possible? How can I do them?
This is my current code from my style.xml file:
<item name="android:fastScrollOverlayPosition">floating</item>
<item name="android:fastScrollTextColor">#000000</item>
<item name="android:fastScrollPreviewBackgroundLeft">#drawable/square</item>
<item name="android:fastScrollPreviewBackgroundRight">#drawable/square</item>
I don't have any info about further customization of the default overlay.
There's a more flexible alternative, though. You could add a TextView to your layout which only appears when the user is scrolling, and show the letter returned from your SectionIndexer's getPositionForSection method. You could then style this view exactly to your liking, and center it in a full-screen RelativeLayout.
I want to add a border to a borderlessbutton. However, if I create my own style with the parent borderlessbutton and I overwrite the background tag I loose the state change animation etc, as this is also defined by the background. I also cannot implement them myself as the native android drawables are not available as public and therefore not accessible. I do not want to have to copy the drawables.
Is it only possible to overwrite ondraw progammatically or is there an xml based solution i am missing?
(btw this is for a periodic table so this should not involve having an xml file for each button as there are about 100 of them)
thanks
stephan
The bulk of this comes from this article.
There is a 4 step process to doing something like this:
Create an XML file that contains the states.
Create an XML file (Or background) for each state
Create the style of the button
Add the button to your layout, and see what it looks like.
The single most difficult thing is the first step, so I'll show that one here. For the other ones, you can visit the site or do your own thing. Essentially, it will look something like this. Basically needs to capture all of the 4 states. This should be saved in the drawable folder, and the name of this is what your application will use for the name of the drawable.
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item
android:state_enabled="false"
android:drawable="#drawable/loc_for_button_disabled" />
<item
android:state_pressed="true"
android:state_enabled="true"
android:drawable="#drawable/loc_for_button_pressed" />
<item
android:state_focused="true"
android:state_enabled="true"
android:drawable="#drawable/loc_for_button_focused" />
<item
android:state_enabled="true"
android:drawable="#drawable/loc_for_button_enabled" />
</selector>
An easy way would be to place your button within a separate layout, e.g. a LinearLayout and give this layout a background color and a padding of e.g. 1dp. This would render a "border" around the button. Note, that this is quite costly in regard of layouting, so do not use this method when you have lots of buttons.
The correct solution would be to create your one drawables for all states and build a statelist drawable with your drawables and assign this statelist drawable as your button's background. Actually it's not that much work, just have a look at http://developer.android.com/guide/topics/resources/drawable-resource.html#StateList
I want to use a Button in my android app but I want to customize how it looks. However, I want the highlight and selected colors of the button to be the same as the default colors (i.e. the dark and light orange gradients, or whatever the theme color supplies).
Is there anyway to get the default highlight/selected drawables and to use that as the fill for my buttons on the selected and highlighted states?
Thanks!
You are asking for two different things, do you want the drawables or the colorcode?
Anyway, you can find the name of the drawables here: http://androiddrawableexplorer.appspot.com/
I don't know if you can use them directly from your app or if you have to save them to your drawables folder first, but you can find them in your sdk. If you want the colorcodes, use gimp to extract them from the pictures.
It seems that you can use a selector as drawable inside a selector!
(You can or should not use #android:drawable/btn_default_selected, because it is private)
This meens that you can write your own selecter and use the whole default android selector for the items you want the default behavior for.
I used this selector
<selector xmlns:android="http://schemas.android.com/apk/res/android" >
<item android:drawable="#android:drawable/btn_default" android:state_pressed="true"/>
</selector>
And added it to as background to a linear layout.
I don't know why, but this messed up the padding/margin as well, thats why i set them to 0.
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:background="#drawable/background_linear_layout_button"
android:padding="0dp"
android:layout_margin="0dp"
android:orientation="vertical" >
<!-- YOUR LAYOUT THAT ACTS LIKE A BUTTON -->
</LinearLayout>
The Result is that you have the parent background color in the unpressed state and the android background color for the pressed state.
Selectors are what you're looking for. Google around for tutorials. Here's one.
I Suppose you can find the Default Selector in the Android Source Code.
I had a simple button set up with a background image defined like
android:background="?attr/button"
where ?attr/button was a reference to a simple 9-patch png. Everything worked fine, text in the button was aligned correctly.
Then I needed to have a different background for a pressed state of the button. So I changed that to
android:background="#drawable/state_button"
where #drawable/state_button is an xml with the following states
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_pressed="true"
android:drawable="#drawable/button_pressed" /> <!-- pressed -->
<item android:state_focused="true"
android:drawable="#drawable/button_pressed" /> <!-- focused -->
<item android:drawable="#drawable/button" /> <!-- default -->
</selector>
And after that I can't align the text properly. If I put android:gravity="center_vertical" the text is drawn about 1/4 of the button height from the top.
I double-checked my 9-patch images, everything seems fine with them. And I also tried having regular pngs for the background, it also doesn't change anything.
You should double check the 9 patch drawables you're using. The standard Android buttons include a huge amount of padding at the top and bottom of the buttons, making it look like the text is always centered. You can see this by opening up the 9 patch file, zooming in closely and looking at the difference between the pixels on the left/top and the right/bottom. The left/top sides mark which parts of the image can be stretched to accomodate more text, while the right/bottom sides mark the space that will actually be filled with text. So the difference between the right/bottom side and the left/top will be the padding. It doesn't quite make sense at first, but after playing around with it it's not so bad.
Just in case you aren't familiar with it, a useful tool for editing 9patches is the draw9patch.bat program in your SDK tools folder.
I had the exact same issue however my 9 patch drawables were ok. The cause was still the same though, just i was using custom drawables using the layer-list element.
It seems that when the Button lays out its text it takes into account all of the states in your selector. Once i'd updated all of the states to match each other my text subsequently aligned correctly.
I am creating simple application in Android and i want to change the focus color.That my application consist of two text box. When moving focus to the textbox,i can get the focus of textbox with the orange color. is it possible to change the color ? If it is possible please tell me how to do it ?
Yes, you can change the focus color of a button (this an open source OS). I poked around the SDK and could not find a direct way to change the focus color of a button. I did find this tantalizing xml file...
widget_button.xml
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_focused="true" android:color="#ff000000"/>
<item android:color="#ff000000"/> <!-- unfocused -->
</selector>
...but I'm having a hard time figuring out where to adjust things. Button extends TextView, and based on the TextView source that's where the focus color is defined.
If you really want to this you need to make your own class from source.
PS: Since this is so hard I suspect it's discouraged by the Andoird team. It makes for a less consistent user interface.