I'm new to Android development and I'm trying to implement some custom buttons, they should look something like this:
So I was wondering if I can use something like a imagebutton and use the image as a background and add text on top of it (I tried this but the text is always in the middle and doesn't have a label so its hard to see..), or should I write a custom style or theme for my button. In case that I have to write a custom style or theme, could you please help me out with this? How should I go about doing it?
For each of those Grid elements, create a framelayout for each, put the background and then the label in front. Frame layouts allow things on top of each other. You can put the labels with layout_gravity bottom and also add a transparent color to it so the image in the back can be seen. Also add a onClickListener to each of the framelayouts so they act as buttons.
Related
I have an issue regarding design 'Setting screen' for my app. In this screen I need to design circular menu options in a triangular shape and I need to set OnClickListener only on the triangular area, which is only visible option border area. I can't understand what approach I need to use to achieve this design as well as set OnClickListener.
Iam working on an tablet app that needs a dropdown panel that flots on top of everything inclunding my toolbar. And should look something like
Can you please suggest the best UI widget that best suits this purpose, putting into consideration elevation and alignment inside the toolbar
For me it's a PopupWindow shown with showAsDropDown. You would have to prepare a layout with highlit back button and the product list. Then create a PopupWindow with that layout set as a content.
The other option is to prepare the popup as a custom, hidden layout lying on your main screen (use FrameLayout) and change its visibility when needed.
I'm not sure, but you may need a custom ViewOutlineProvider with convex path outline. PopupWindow may be unable to drop a non-rectangular shadow like on your screenshot. In such case you would have to set its background to transparent (or maybe null?), disable window's shadow and cast shadow with custom ViewOutlineProvider.
I have start and end date time fields that look like in picture below. Blue color shows active selection - if we select right then blue color goes to right and white color appears on the left and vice versa.
Hardest part is to create that arrow style in the middle. What should i use because buttons are rectangles and I don't know how it could be done.
It's easy. Just use ninepatch.
You can start there:
http://radleymarx.com/blog/simple-guide-to-9-patch/
you need a custom image according to what you ask, maybe extend ToggleButton for that but basically what you want is the same component when pressing on two different places on the same component will dispatch different events.
I would for example extend Linear layout, make it vertical layout, put two clickable textView\buttons with 9 patch images as background ,like suggested before, one for the white part and the other for the blue part. and replace the background image for any event u like.
you can also create a StateListDrawable with actions for selected and deselected and set the state of each drawable upon the right click
I know how to make the gradient and the logo. But I don`t know how to add all that different borders and how to add the refresh icon (that also has some custom border around it).
Instagram Action Bar:
How is that possible?
You can do it by using a horizontal LinearLayout with 2 children, the left hand column with the logo and the right hand column with the refresh button. You can create a background drawable using the Shape XML:
http://developer.android.com/guide/topics/resources/drawable-resource.html#Shape
I'd look at the provided ActionBar and ActionBarCompat. It has hooks for producing basic, as well as complex action bars.
I have...
PNG file for Background
PNG file for Icon (drawableTop)
Text I want to put underneath this Button
It's similar to a Menu Icon. How to do that? I only found following ways. Both of them arent very nice:
Make two Buttons, one for Text one for the Picture
The Background PNG File needs a transparent area at the bottom in the size of the text.
After some months of working with Android it's not that hard anymore. You can set any View (ImageView, TextView, LinearLayout, RelativeLayout...) clickable.
So in this case I would go with a Relative- or LinearLayout. They also can use the same style, so the position of the icons are always the same.
Set the text as the button text via the attribute android:text. Use the android:drawableTop attribute to set an icon that will appear above the text.