How can i do 1 button with 2 labels with different style inside in android?
(Like the image)
Thank's
You can create a custom view. I have used Layout as a button by setting custom button style to the layout and have added two textViews to it, this way:
<LinearLayout android:id="#+id/customButtonLayout"
android:layout_height="wrap_content" style="#android:style/Widget.Button"
android:layout_width="wrap_content">
<TextView android:text="First" android:id="#+id/firstTextView"
android:layout_width="wrap_content" android:layout_height="wrap_content"
android:textColor="#000"></TextView>
<TextView android:textColor="#000" android:text="Second"
android:layout_height="wrap_content" android:id="#+id/secondTextView"
android:layout_width="wrap_content" android:layout_marginLeft="10dp"></TextView>
</LinearLayout>
The only way I can think with which you could applay different textstyles to a Button is to use HTML (with HTML.fromHTML()). But I wouldn't recommend that, because probably it wouldn't look good. Use a Layout instead(Linear - or RealtivLayout). Add two TextViews to it and set a selector as the background(to have a "click-effect").
Related
Instead of just a textview on a button, I'd like the button to contain a layout with two TextViews. See the mockup below. When a user uses the button to add a category, I'd like to update the percentage on the right. I have this working with an included layout, but I want to use a button so that the user instinctively knows to click it.
Button is a View not a ViewGroup. To achieve that, use a horizontal LinearLayout, style it as a button and add a ClickListener to it. Something like this:
<RelativeLayout
android:clickable="true"
android:background="#android:drawable/btn_default"
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<TextView
android:id="#+id/text1"
android:text="Category"
android:layout_width="wrap_content"
android:layout_height="wrap_content"/>
<TextView
android:id="#+id/text2"
android:text="value"
android:layout_width="wrap_content"
android:layout_height="wrap_content"/>
</RelativeLayout>
Note that the background of the layout is set to the default android button so it will look like a button.
I have something like "There are 200€" but I want to style the value (ex. textColor Red)
Is there any way of having two textViews to seem like an entire one?
A textView inside a textView or a textViewContainer or something.
I can achieve it on the run like this answer: Change text color of one word in a TextView
But I want to do from the layout file. Any chance?
Thanks
EDIT
<TextView
android:id="#+id/lastIncome"
android:text="Tu último ingreso fueron"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="#dimen/dash_font_size"/>
<TextView
android:id="#+id/lastIncomeValue"
android:text="200€"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="#dimen/dash_value_font_size"
android:textColor="#color/greensea"
android:layout_gravity="right"/>
You can achieve this with a horizontal LinearLayout. The LinearLayout is the container for the two side by side TextViews. This layout can be placed in any other container (LinearLayout, RelativeLayout, etc.) in your XML.
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="There are " />
<TextView
android:id="#+id/amount"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="200€"
android:textColor="#ff0000"/>
</LinearLayout>
You can use a easy approach to do this within one textview using SpanableString Builder Click here to get this approach
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:gravity="center" android:background="#drawable/robo">
<TextView android:id="#+id/TextView02"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Max Time(Sec)">
</TextView>
<EditText android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="100"
android:id="#+id/maximum"
android:inputType="number">
</EditText>
<Button android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Start"
android:id="#+id/startbtn"
android:focusable="true">
</Button>
<ImageButton android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:src="#drawable/icon"
android:id="#+id/imageButton1">
</ImageButton>
</LinearLayout>
In LinearLayout you can't change positions a whole lot - because the layout is Linear (sequential). But you can use layout_margin to somewhat move the widgets.
I don't know what you want to do, but you should look into FrameLayout (which will let you put the image anywhere!). My personal favorite is RelativeLayout.
Position depends on position of it's parent container/component (Layout) and on it's layout_* properties.
And u did'n tell what u want. If u want change it position - switch it with another view in Layout.
put more buttons in layout and hide or show them according to your needs
views in android are in relationship, not only in RelativeLayout but in Others, so you should choose the best way to describe your app layout, using more than one is commonly used.
to change position of label, you 'd better using AbsoluteLayout then using android:layout_x="", android:layout_y=""
what is your exact requirement???
you can put two buttons and make one visible and other one invisible or vice verse.or you can put layout_margin for all direction.And try to put all your component in different layout.
I am creating a custom button. I want to set the position of text on button.
I have two background images for button (button_off and button_on) first is for normal button and second is for onFocus / onPressed state.
Now I have to put text on button then it should look like:
But i am unable to set the exact position of the text on this background button image.
Please share your suggestion to solve this issue.
You can try using 9-patch image as a background. More information on this here: http://developer.android.com/guide/topics/graphics/2d-graphics.html#nine-patch
You can set these properties in XML file, `
<Button
android:id="#+id/button1"
android:layout_width="120dp"
android:layout_height="wrap_content"
android:drawablePadding="5dp"
android:drawableLeft="#android:drawable/ic_lock_lock"
android:text="All"
android:gravity="center"/>
`
Align the text , use gravity option ! or try with padding
<Button
android:id="#+id/button1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:drawableLeft="#android:drawable/arrow_down_float"
android:background="#drawable/btn_all_bg"
android:text="All">
Button>
You can use the drawableLeft/right/top/bottom to add icon on a button and text would automatically adjust.
Few ways :
define a button and try android:drawableStart
extend Button and draw yourself
try to define a LinearLayout that hold a text and an image with a
background of your button,
set both of them weight of 1 and put them inside another LinearLayout and make them onClick
can't assure 3 will work without a tweak or two but it worth trying
You can use the layout as a button style="#android:style/Widget.Button", and configure it as you want.
Paste this in your xml file:
<LinearLayout
android:id="#+id/button"
style="#android:style/Widget.Button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical" >
<TextView
android:id="#+id/textView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="2dp"
android:text="TextView" />
</LinearLayout>
I've noticed that layout_alignBaseline of TextVew control doesn't work with Spinner control.
I'm trying to place a text to the left of spinner, but it goes to the top of the parent control.
<Spinner
android:id="#+id/locations"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_below="#id/userCode"
android:layout_alignLeft="#id/userCode"
android:layout_marginTop="15dip"
/>
<TextView
android:id="#+id/locationsLbl"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Region"
android:layout_alignBaseline="#id/locations"
/>
Is it a bug or I do something wrong? The same technique works fine with EditText controls.
I am also facing the same problem but found the following workaround
<Spinner
android:id="#+id/locations"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_below="#id/userCode"
android:layout_alignLeft="#id/userCode"
android:layout_marginTop="15dip"/>
<TextView
android:id="#+id/locationsLbl"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Region"
android:layout_alignTop="#+id/locations"
android:layout_alignBottom="#+id/locations"
android:gravity="center_vertical"/>
Newer versions of Android support base line alignment for Spinners. The Spinner will create the first View of the list and use its baseline alignment.
If that doesn't work, make sure your spinner adapter creates a View that supports base line alignment. (getBaseline() != -1). For LinearLayouts, you can use the baselineAlignedChildIndex attribute to specify a child within the linear layout to use.
android:layout_toLeftOf="#id/locations" ?