Develop Reference

Android Studio ImageButton changing shape after implementing a style

I've searched here and it doesn't seem like anyone has had this problem.
I'm following the Android Studio tutorials from here.
Basically what is happening is that my buttons look fine when I implement my XML code, but when I transfer over some of the XML code to my styles.xml and import it into my activity_main.xml file, my button changes its dimensions.
Here's my activity_main.xml file.
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:padding="16sp"
tools:context=".MainActivity"
>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1">
<ImageButton
android:id="#+id/decreaseTeam1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"
android:layout_centerVertical="true"
android:src="#drawable/ic_minus"
android:contentDescription="#string/minus_button"
android:background="#drawable/button_background"
android:onClick="decreaseScore" />
<ImageButton
android:id="#+id/increaseTeam1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_centerVertical="true"
android:src="#drawable/ic_plus"
android:contentDescription="#string/plus_button"
android:layout_alignParentEnd="true"
android:onClick="increaseScore"
android:background="#drawable/button_background"/>
<TextView
android:id="#+id/score_1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:layout_centerHorizontal="true"
android:text="#string/initial_score"/>
<TextView
android:id="#+id/team1_name"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true"
android:text="#string/team_1"/>
</RelativeLayout>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1">
<ImageButton
android:id="#+id/decreaseTeam2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"
android:layout_centerVertical="true"
android:src="#drawable/ic_minus"
android:background="#drawable/button_background"
android:contentDescription="#string/minus_button"
android:onClick="decreaseScore"
/>
<ImageButton
android:id="#+id/increaseTeam2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_alignParentEnd="true"
android:layout_centerVertical="true"
android:src="#drawable/ic_plus"
android:contentDescription="#string/plus_button"
android:onClick="increaseScore"
android:background="#drawable/button_background"/>
<TextView
android:id="#+id/score_2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:layout_centerHorizontal="true"
android:text="#string/initial_score"/>
<TextView
android:id="#+id/team2_name"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true"
android:text="#string/team_2"/>
</RelativeLayout>
</LinearLayout>
My strings.xml file.
<resources>
<string name="app_name">Scorekeeper</string>
<string name="team_2">Team 2</string>
<string name="initial_score">0</string>
<string name="plus_button">Plus Button</string>
<string name="minus_button">Minus Button</string>
<string name="team_1">Team 1</string>
</resources>
drawable.ic_minus:
<vector android:height="40dp" android:viewportHeight="24.0"
android:viewportWidth="24.0" android:width="40dp" xmlns:android="http://schemas.android.com/apk/res/android">
<path android:fillColor="#FF000000" android:pathData="M19,13H5v-2h14v2z"/>
</vector>
drawable.ic_plus:
<vector android:height="40dp" android:viewportHeight="24.0"
android:viewportWidth="24.0" android:width="40dp" xmlns:android="http://schemas.android.com/apk/res/android">
<path android:fillColor="#FF000000" android:pathData="M19,13h-6v6h-2v-6H5v-2h6V5h2v6h6v2z"/>
</vector>
drawable.button_background:
<?xml version="1.0" encoding="utf-8"?>
<shape
xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="oval">
<stroke
android:width="2dp"
android:color="#color/colorPrimary"/>
</shape>
I hope I have not missed anything out. If you copy paste my code inside an empty activity activity_main.xml file, you should see something like this.
Now the problem:
I want to implement some styles for my buttons. I have updated my styles.xml as such. In this case I have a parent ScoreButton which only takes the background, whereas the child elements are the plus and minus, which takes the picture and description.
<resources>
<!-- Base application theme. -->
<style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
<!-- Customize your theme here. -->
<item name="colorPrimary">#color/colorPrimary</item>
<item name="colorPrimaryDark">#color/colorPrimaryDark</item>
<item name="colorAccent">#color/colorAccent</item>
</style>
<style name="ScoreButtons" parent="Widget.AppCompat.Button">
<item name="android:background">#drawable/button_background</item>
</style>
<style name="PlusButtons" parent="ScoreButtons">
<item name="android:src">#drawable/ic_plus</item>
<item name="android:contentDescription">#string/plus_button</item>
</style>
<style name="MinusButtons" parent="ScoreButtons">
<item name="android:src">#drawable/ic_minus</item>
<item name="android:contentDescription">#string/minus_button</item>
</style>
</resources>
And if I update one of my button's code as such, for instance, replacing #+id/decreaseTeam1 with the code below:
<ImageButton
android:id="#+id/decreaseTeam1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"
android:layout_centerVertical="true"
style="#style/PlusButtons"
android:onClick="decreaseScore" />
The minus button suddenly becomes inflated.
I read that child views override parent views, but I don't see how that can be a problem, since there is no change to the image size, nor have I compressed it.

The problem is that in the style definition, your ScoreButtons has Widget.AppCompat.Button as parent. This style defines a minHeight and minWidth, as follows:
<style name="Base.Widget.AppCompat.Button" parent="android:Widget">
<item name="android:background">#drawable/abc_btn_default_mtrl_shape</item>
<item name="android:textAppearance">?android:attr/textAppearanceButton</item>
<item name="android:minHeight">48dip</item>
<item name="android:minWidth">88dip</item>
<item name="android:focusable">true</item>
<item name="android:clickable">true</item>
<item name="android:gravity">center_vertical|center_horizontal</item>
</style>
So, in order to solve your problem, you just have to remove the parent from ScoreButtons style:
<style name="ScoreButtons">
<item name="android:background">#drawable/button_background</item>
</style>

You have an error in your style. You are using an ImageButton not a Button
So, you should write
<style name="ScoreButtons" parent="Widget.AppCompat.ImageButton"> // ImageButton
<item name="android:background">#drawable/button_background</item>
</style>

you are making a mistake while assigning a style. you need to use ImageButton instead of using Button.
Use this:
<style name="ScoreButtons" parent="Widget.AppCompat.ImageButton">
<item name="android:background">#drawable/button_background</item>
<item name="android:contentDescription">#string/minus_button</item>
</style>
Instead of this:
<style name="ScoreButtons" parent="Widget.AppCompat.Button">
<item name="android:background">#drawable/button_background</item>
<item name="android:contentDescription">#string/minus_button</item>
</style>

Separate stars in a ratingbar

I need to separate the stars in a RatingBar, it's possible? Or have I to create my own RatingBar?
<RatingBar
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:numStars="7"
android:id="#+id/estrellas2"
android:scaleX="1.2"
android:scaleY="1.2"
android:layout_below="#+id/textView2"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"
android:layout_marginLeft="30dp"/>

Set
android:progressDrawable="#drawable/custom_ratingbar_selector"
property to customize rating bar .
and
Create custom_ratingbar_selector.xml in drawable and paste this code
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item
android:id="#android:id/background"
android:drawable="#drawable/unslected_star_icon" />
<item
android:id="#android:id/secondaryProgress"
android:drawable="#drawable/unslected_star_icon" />
<item
android:id="#android:id/progress"
android:drawable="#drawable/slected_star_icon" />
</layer-list>

Try this code,
android:progressDrawable = "#drawable/rat_star"
android:indeterminateDrawable = "#drawable/rat_star"
#drawable/rat_star :
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item android:id="#+android:id/background"
android:drawable="#drawable/starempty" />
<item android:id="#+android:id/secondaryProgress"
android:drawable="#drawable/starempty" />
<item android:id="#+android:id/progress"
android:drawable="#drawable/star" />
</layer-list>

Android: Title not shown in Custom Title Bar with Custom ListAdapter View

I have created a custom title bar with the following.
myapptitle.xml
<?xml version="1.0" encoding="utf-8"?>
<TextView
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/myTitle"
android:text="#string/app_name"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:textColor="#color/titletextcolor"
android:textSize="14sp"
android:layout_gravity="top"
/>
themes.xml
<?xml version="1.0" encoding="utf-8"?>
<resources>
<style name="customTheme" parent="android:Theme">
<item name="android:windowTitleBackgroundStyle">#style/WindowTitleBackground</item>
<item name="android:windowTitleSize">40dip</item>
</style>
</resources>
manifext.xml
<application
android:label="#string/app_name"
android:theme="#style/customTheme" >
.....
I have created a customList adapater and a layout for that like the one below.
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical" >
<ImageView
android:id="#+id/icon"
android:layout_width="22dip"
android:layout_height="22dip"
android:layout_marginLeft="4dip"
android:layout_marginRight="10dip"
android:layout_marginTop="4dip"
android:contentDescription="#string/app_msg_title"
android:src="#drawable/logo_small" >
</ImageView>
<TextView
android:id="#+id/msgDate"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:textSize="14sp"
/>
<TextView
android:id="#+id/msgTitle"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:textSize="14sp" />
<TextView
android:id="#+id/label"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#+id/label"
android:textSize="12sp" >
</TextView>
</LinearLayout>
In my list activity I have given the below code on onCreate method.
requestWindowFeature(Window.FEATURE_CUSTOM_TITLE);
getWindow().setFeatureInt(Window.FEATURE_CUSTOM_TITLE,
R.layout.myapptitle);
But somehow while running the application I'm getting the title bar without any text in it at all. In my strings.xml for app_name i have My Notifications as text.
Appreciate all your time and help.
Edited
Styles.xml
<?xml version="1.0" encoding="utf-8"?>
<resources>
<style name="WindowTitleBackground">
<item name="android:background">#color/titlebackgroundcolor</item>
</style>
</resources>

Change your style.xml like below:
<resources>
<style name="CustomWindowTitleBarBG">
<item name="android:background">#323331</item>
</style>
<style name="TitleBarTheme" parent="android:Theme">
<item name="android:windowTitleSize">35dip</item>
<item name="android:windowTitleBackgroundStyle"> #style/CustomWindowTitleBarBG</item>
</style>
</resources>
Then
In manifest file, use TitleBarTheme in application tag and for activity use like below:
android:theme="#android:style/Theme.NoTitleBar"
and in activity class use your code which is:
requestWindowFeature(Window.FEATURE_CUSTOM_TITLE);
getWindow().setFeatureInt(Window.FEATURE_CUSTOM_TITLE,
R.layout.myapptitle);

Android: keep blue background after ListView selection xml definitions

I'm confused with the answers to this question.
I have the following in values-14/styles.xml
<resources>
<style name="AppTheme" parent="android:Theme.Holo.Light.DarkActionBar" />
<style name="ListTheme" parent="AppTheme">
<item name="android:activatedBackgroundIndicator">#drawable/br_listitem</item>
</style>
</resources>
then I have defined in my drawable dir br_listitem.xml
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="#color/SlateBlue" android:state_activated="true"/>
</selector>
and finally in my listitem.xml file I have
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_height="wrap_content"
android:layout_width="600dp"
android:gravity="left|center"
android:paddingBottom="10dp"
android:paddingTop="10dp"
android:paddingLeft="5dp"
style="#style/ListTheme"
android:background="?android:attr/activatedBackgroundIndicator">
I get a light orange color when pressed and light green after. The activated background works, but it's not using my colors...
Thanks !
~ Jay
Based on comments I made the following changes. I pulled the style out of the LinearLayout and put it in my listview as follows:
<ListView
style="#style/ListTheme"
android:id="#+id/XYZList"
android:layout_height="600dp"
android:layout_width="600dp"
android:layout_column="0"
android:layout_columnSpan="2"
android:layout_gravity="center|top"
android:layout_row="2"
android:layout_rowSpan="10"
android:focusable="true"
android:choiceMode="multipleChoice"
android:background="#80D0D0D0"
>
</ListView>

Android Button with No Padding

I am trying to use the open source antennapod application as a reference for building my android application. I am using ActionBarSherlock and want to create a button at the bottom of my layout that extends from side to side with no padding. It should look like this:
My Styles.xml looks like this:
<?xml version="1.0" encoding="utf-8"?>
<resources xmlns:android="http://schemas.android.com/apk/res/android">
<style name="Theme.Application.Light" parent="#style/Theme.Sherlock.Light">
<item name="attr/non_transparent_background">#color/white</item>
<item name="attr/borderless_button">#drawable/borderless_button</item>
</style>
</resources>
borderless_button.xml looks like this:
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_pressed="true"><shape android:shape="rectangle">
<solid android:color="#color/selection_background_color_light" />
</shape></item>
<item android:state_focused="true"><shape android:shape="rectangle">
<solid android:color="#color/selection_background_color_light" />
</shape></item>
<item><shape android:shape="rectangle">
<solid android:color="#android:color/transparent" />
</shape></item>
</selector>
attrs.xml looks like this:
<?xml version="1.0" encoding="utf-8"?>
<resources>
<attr name="borderless_button" format="reference" />
<!-- Used in itemdescription -->
<attr name="non_transparent_background" format="reference" />
</resources>
My Manifest has this:
<application
android:allowBackup="true"
android:icon="#drawable/ic_launcher"
android:label="#string/app_name"
android:theme="#style/Theme.Application.Light" >...</>
My layout is:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical" >
<LinearLayout
android:id="#+id/footer"
style="#android:style/ButtonBar"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:orientation="horizontal" >
<Button
android:id="#+id/butConfirm"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="Search" />
</LinearLayout>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content" >
<TextView
android:id="#+id/queryString"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_margin="8dp"
android:focusable="true"
android:focusableInTouchMode="true"
android:text="What would you like to search for?" />
<EditText
android:id="#+id/etxtQueryString"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_below="#id/queryString"
android:layout_margin="8dp"
android:hint="Enter Query"
android:inputType="textUri" />
</RelativeLayout>
</RelativeLayout>
What it ends up looking like:
I just need one button but still want it to cover the whole width of the screen.
Here is the link to the source code I am using as a guide.
https://github.com/danieloeh/AntennaPod
Any help would be awesome!
Thanks

<Button
android:id="#+id/butConfirm"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="Search"
android:background="#null"/>
This should do the trick!