Android kitkat (Api 19) styling

Android kitkat (Api 19) styling - android

I'm trying to change the color of the DatePickerDialog (See image below) in API 19 (Android 4.4 Kitkat).
I'm creating the DatePickerDialog when clicking on an EditText box, so I don't have an XML file, where I can set properties of the DatePickerDialog.
I've tried styling it with the code below this, but that doesn't work as the minimum requirement is API Version 21.
<style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
<item name="android:datePickerDialogTheme">#style/MyDatePickerDialogTheme</item>
</style>
<style name="MyDatePickerDialogTheme" parent="android:Theme.Material.Light.Dialog">
<item name="android:datePickerStyle">#style/MyDatePickerStyle</item>
<item name="android:colorAccent">#color/ColorPrimaryDark</item>
</style>
<style name="MyDatePickerStyle" parent="#android:style/Widget.Material.Light.DatePicker">
<item name="android:headerBackground">#color/ColorPrimaryDark</item>
</style>
Is there anyone out there, that have a solution for this problem? My issue only appears in api below 21, as I have a different styling for the api levels above 21.
Regards!
Code for setting up the DatePickerDialog:
private void setDateTimeField() {
Date.setOnClickListener(this);
Calendar newCalendar = Calendar.getInstance();
DateDialog = new DatePickerDialog(this, new DatePickerDialog.OnDateSetListener() {
public void onDateSet(DatePicker view, int year, int monthOfYear, int dayOfMonth) {
if(view.isShown())
{
Calendar newDate = Calendar.getInstance();
newDate.set(year, monthOfYear, dayOfMonth);
String dob_var = dateFormat.format(newDate.getTime());
String date = dob_var.replaceAll("([A-Z])\\w+ ", "");
String dayOfWeek = Variables.getDayOfWeek(date);
Date.setText(dayOfWeek.toUpperCase() + " " + date);
Variables.dateToGet = date;
weekNumber.setText(variables.getWeekNumber(date));
lv.setAdapter(null);
results.clear();
new RetrieveFeedTask().execute();
adapter = new MyCustomBaseAdapter(view.getContext(), results);
lv.setAdapter(adapter);
}
}
},newCalendar.get(Calendar.YEAR), newCalendar.get(Calendar.MONTH), newCalendar.get(Calendar.DAY_OF_MONTH));
}
XML File:
<resources>
<style name="AppTheme.NoActionBar">
<item name="windowActionBar">false</item>
<item name="windowNoTitle">true</item>
</style>
<style name="AppTheme.AppBarOverlay" parent="ThemeOverlay.AppCompat.Dark.ActionBar" />
<style name="AppTheme.PopupOverlay" parent="ThemeOverlay.AppCompat.Light" />
<!-- Base application theme. -->
<style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
<item name="colorPrimary">#color/MenuBar</item>
<item name="colorPrimaryDark">#color/ShadowMenuBar</item>
<item name="colorControlNormal">#color/ColorPrimaryDark</item>
<item name="colorControlActivated">#color/ColorPrimaryDark</item>
<item name="colorControlHighlight">#color/ColorPrimaryDark</item>
<item name="colorAccent">#color/ColorPrimaryDark</item>
<!--<item name="android:datePickerDialogTheme">#style/MyDatePickerDialogTheme</item>-->
</style>
<!--<style name="MyDatePickerDialogTheme" parent="android:Theme.Material.Light.Dialog">
<item name="android:datePickerStyle">#style/MyDatePickerStyle</item>
<item name="android:colorAccent">#color/ColorPrimaryDark</item>
</style>
<style name="MyDatePickerStyle" parent="#android:style/Widget.Material.Light.DatePicker">
<item name="android:headerBackground">#color/ColorPrimaryDark</item>
</style>-->
Layoutfile:
<?xml version="1.0" encoding="utf-8"?>
<EditText
android:id="#+id/date"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="01-01-2016"
android:hint="Date"
android:layout_alignParentTop="true"
android:layout_alignParentEnd="true"
android:layout_alignParentStart="true" />
<ListView
android:id="#+id/listItemSkema"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fadeScrollbars="false"
android:layout_above="#+id/previousDay"
android:layout_below="#+id/date"
android:layout_alignParentEnd="true"
android:layout_alignParentStart="true">
</ListView>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/previousDay"
android:id="#+id/previousDay"
android:layout_alignParentBottom="true"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/weekNumber"
android:text="Uge"
android:textColor="#color/black"
android:textSize="35sp"
android:layout_alignParentBottom="true"
android:layout_centerHorizontal="true" />
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/nextDay"
android:id="#+id/nextDay"
android:layout_alignParentBottom="true"
android:layout_alignRight="#+id/listItemSkema"
android:layout_alignEnd="#+id/listItemSkema" />

Related

how to change the button text color on AlertDialog globally using style?

on android O when i do this :
<style name="MyTheme" parent="#android:style/Theme.Material.Light.NoActionBar">
<item name="android:textColor">#ff0000</item>
</style>
The text button color of my alertdialog change, but this not work under lollipop. Worse on lollipop it's change the color of the title of the alertdialog instead.
How from kitkat to android O I can globally change the font color of the button of all my alertdialog ?

With the MaterialComponents theme and the MaterialAlertDialogBuilder you can define globally the style using the materialAlertDialogTheme attribute in your app theme.
Something like:
<style name="AppTheme" parent="Theme.MaterialComponents.DayNight">
<item name="materialAlertDialogTheme">#style/My_MaterialAlertDialog</item>
</style>
Then you can define a custom style:
<style name="My_MaterialAlertDialog" parent="#style/ThemeOverlay.MaterialComponents.MaterialAlertDialog">
<!-- Style for positive button -->
<item name="buttonBarPositiveButtonStyle">#style/PositiveButtonStyle</item>
<!-- Style for negative button -->
<item name="buttonBarNegativeButtonStyle">#style/NegativeButtonStyle</item>
<!-- Style for neutral button -->
<item name="buttonBarNeutralButtonStyle">#style/NeutralButtonStyle</item>
</style>
with the button style defined by:
<style name="PositiveButtonStyle" parent="#style/Widget.MaterialComponents.Button">
<item name="android:textColor">#FFFFFF</item>
<item name="backgroundTint">#color/primaryDarkColor</item>
</style>
<style name="NegativeButtonStyle" parent="#style/Widget.MaterialComponents.Button.TextButton.Dialog">
<item name="android:textColor">#color/primaryDarkColor</item>
</style>
<style name="NueutralButtonStyle" parent="#style/Widget.MaterialComponents.Button.TextButton.Dialog">
....
</style>
With the version 1.1.0 of the library you can also simply override the default color using the materialThemeOverlay in the custom style:
<style name="My_MaterialAlertDialog" parent="#style/ThemeOverlay.MaterialComponents.MaterialAlertDialog">
<item name="materialThemeOverlay">#style/DialogButtonOverlay</item>
</style>
<style name="DialogButtonOverlay">
<item name="colorPrimary">#color/...</item>
</style>

You need to write a theme for AlertDialog and set it to AppTheme. It will change you alet dialog theme globally.
<style name="AppAlertDialog" parent="Theme.AppCompat.Light.Dialog.Alert">
<item name="buttonBarNegativeButtonStyle">#style/NegativeButtonStyle</item>
<item name="buttonBarPositiveButtonStyle">#style/PositiveButtonStyle</item>
</style>
<style name="NegativeButtonStyle" parent="Widget.AppCompat.Button.ButtonBar.AlertDialog">
<item name="android:textColor">#color/colorPrimaryText</item>
<item name="android:backgroundTint">#android:color/transparent</item>
</style>
<style name="PositiveButtonStyle" parent="Widget.AppCompat.Button.ButtonBar.AlertDialog">
<item name="android:textColor">#color/colorPrimaryText</item>
<item name="android:backgroundTint">#android:color/transparent</item>
</style>
<style name="AppTheme" parent="Theme.MaterialComponents.Light">
...
<item name="alertDialogTheme">#style/AppAlertDialog</item>
</style>

Create a Java Class for your custom alert dialog
public class Dialog {
private static final int resId = R.layout.dialog_dialog;
private AlertDialog alertDialog;
/**
* Custom Dialog
*
* #param context
* #param titleText
* #param message
* #param positiveText
* #param negativeText
* #param type
* #param dialogListener
*/
public Dialog(final Context context,
String titleText,
String message,
String positiveText,
String negativeText,
Type type,
final DialogListener dialogListener) {
TextView labelTitle, labelMessage, buttonPositive, buttonNegative;
View view = LayoutInflater.from(context).inflate(resId, null, false);
labelTitle = view.findViewById(R.id.labelTitle);
labelMessage = view.findViewById(R.id.labelMessage);
buttonPositive = view.findViewById(R.id.buttonPositive);
buttonNegative = view.findViewById(R.id.buttonNegative);
if (Utils.isNotEmpty(titleText)) labelTitle.setText(titleText); //(HMI2Utils.isNotEmpty is a null check
if (Utils.isNotEmpty(message)) labelMessage.setText(message);
if (Utils.isNotEmpty(positiveText)) buttonPositive.setText(positiveText);
if (Utils.isNotEmpty(negativeText)) buttonNegative.setText(negativeText);
switch (type) {
case DANGEROUS:
labelTitle.setTextColor(ContextCompat.getColor(context, R.color.white));
}
buttonNegative.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View v) {
alertDialog.dismiss();
dialogListener.onNegativeButtonClick();
}
});
buttonPositive.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View v) {
alertDialog.dismiss();
dialogListener.onPositiveButtonClick();
}
});
Utils.hideSoftKeyboard((Activity) context);
ContextThemeWrapper ctw = new ContextThemeWrapper(context, R.style.MyDialogTheme);
AlertDialog.Builder alertDialogBuilder = new AlertDialog.Builder(ctw);
alertDialogBuilder.setCancelable(false);
alertDialogBuilder.setView(view);
alertDialog = alertDialogBuilder.create();
Window window = alertDialog.getWindow();
if (window != null) {
window.setBackgroundDrawable(new ColorDrawable(Color.TRANSPARENT));
window.addFlags(WindowManager.LayoutParams.FLAG_DRAWS_SYSTEM_BAR_BACKGROUNDS);
window.clearFlags(WindowManager.LayoutParams.FLAG_TRANSLUCENT_STATUS);
window.setStatusBarColor(ContextCompat.getColor(context, R.color.app_theme_color));
}
alertDialog.show();
}
and for xml
<?xml version="1.0" encoding="utf-8"?> <FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/rlRoot"
android:layout_width="736.15px"
android:layout_height="532.66px"
tools:ignore="Overdraw">
<View
android:id="#+id/focus_eater_dummy"
android:layout_width="1px"
android:layout_height="1px"
android:focusable="true" />
<ImageView
android:layout_width="736.15px"
android:layout_height="532.66px"
android:scaleType="fitXY"
android:src="your drawable" />
<RelativeLayout
android:id="#+id/container"
android:layout_width="736.15px"
android:layout_height="wrap_content"
android:orientation="vertical"
>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="67.83px"
android:layout_marginRight="67.83px"
android:layout_marginTop="57.855px"
android:orientation="vertical">
<TextView
android:id="#+id/labelTitle"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:ellipsize="end"
android:gravity="center_horizontal"
android:maxLines="1"
android:text="#string/delete_message_string"
android:textColor="#color/white"
android:textSize="24sp" />
<TextView
android:id="#+id/labelMessage"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="18px"
android:lineSpacingExtra="18px"
android:gravity="center_horizontal"
android:lineSpacingMultiplier="1"
android:text="#string/delete_message_string"
android:textColor="#color/white"
android:textSize="24sp" />
</LinearLayout>
</RelativeLayout>
<LinearLayout
android:id="#+id/containerButtons"
android:layout_width="736.15px"
android:layout_height="532.66px"
android:weightSum="2"
android:gravity="bottom"
android:layout_gravity="bottom"
android:orientation="horizontal">
<TextView
android:id="#+id/buttonPositive"
android:layout_width="0dp"
android:layout_weight="1"
android:layout_height="#dimen/margin_button_vertical_dai"
android:background="#drawable/popup_button_selector"
android:gravity="center"
android:textColor="#color/white"
android:textSize="32sp"
tools:text="OK" />
<TextView
android:id="#+id/buttonNegative"
android:layout_width="0dp"
android:layout_weight="1"
android:layout_height="100dp"
android:background="#drawable/popup_button_selector"
android:gravity="center"
android:text="Cancel"
android:textColor="#color/white"
android:textSize="32sp" />
</LinearLayout>
</FrameLayout>
make your custom changes and call the dialog like
new Dialog(context,
"Title 1",
"Message 2",
"OK",
"Cancel",
Dialog.Type.DANGEROUS,
new Dialog.DialogListener() {
#Override
public void onPositiveButtonClick() {
//implement Click here
}
#Override
public void onNegativeButtonClick() {
//implement Click here
}
}
);
dialog.dismiss();

Popup menu style issue

I am developing one app in which I have a list and a popup menu in it. But my app has black background color and text color is white. But my popup menu back color coming is white and text color is white. I have tried all posible ways but its not working. Here is my code.
Style.xml
<attr name="iconColor" format="reference" />
<!-- Base application theme. -->
<style name="AppTheme" parent="Theme.AppCompat.NoActionBar">
<!-- Customize your theme here. -->
<item name="colorPrimary">#color/back_color</item>
<item name="colorPrimaryDark">#android:color/holo_orange_dark</item>
<item name="android:textColor">#color/White</item>
<item name="android:textSize">12dp</item>
<item name="android:windowActionBarOverlay">true</item>
<item name="iconColor">#android:color/white</item>
<item name="android:popupBackground">#color/back_color</item>
<item name="android:popupMenuStyle">#style/PopupMenu</item>
<item name="colorAccent">#android:color/holo_red_light</item>
</style>
<style name="AppTheme.AppBarOverlay" parent="ThemeOverlay.AppCompat.Dark.ActionBar" />
<style name="AppTheme.PopupOverlay" parent="ThemeOverlay.AppCompat.Light" >
<item name="android:panelBackground">#color/back_color</item>
<item name="android:textColor">#color/black</item>
</style>
<style name="StyledScrollerTextAppearance" parent="#android:style/TextAppearance">
<item name="android:textSize">24sp</item>
<item name="android:textStyle">bold</item>
<item name="android:textColor">#android:color/white</item>
</style>
<style name="AppTheme.TextAppearance">
<item name="android:textColor">#color/White</item>
<item name="android:textSize">12dp</item>
</style>
<style name="AppTheme.TextAppearance.Subtitle">
<item name="android:textColor">#color/White</item>
<item name="android:textSize">10dp</item>
</style>
<style name="PopupMenu">
<item name="android:panelBackground">#color/back_color</item>
<item name="android:textColor">#color/White</item>
</style>
<style name="Theme.AppCompat.Light.NoActionBarCustom" parent="Theme.AppCompat.Light.NoActionBar" >
<item name="colorAccent">#android:color/holo_red_dark</item>
</style>
Below is recycler view adapter
#Override
public void onBindViewHolder(ItemHolder itemHolder, int i) {
Song localItem = arraylist.get(i);
itemHolder.title.setText(localItem.title);
itemHolder.artist.setText(localItem.artistName);
setOnPopupMenuListener(itemHolder, i);
}
private void setOnPopupMenuListener(ItemHolder itemHolder, final int position) {
itemHolder.popupMenu.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View v) {
Context wrapper = new ContextThemeWrapper(mContext, R.style.PopupMenu);
final PopupMenu menu = new PopupMenu(wrapper, v);
menu.setOnMenuItemClickListener(new PopupMenu.OnMenuItemClickListener() {
#Override
public boolean onMenuItemClick(MenuItem item) {
switch (item.getItemId()) {
case R.id.popup_play:
break;
case R.id.popup_next:
break;
}
return false;
}
});
menu.inflate(R.menu.popup_song);
menu.show();
}
});
}
Please help me with it.

After reading comments, you need a contextual menu.
Inherit your PopupMenu from Widget.PopupMenu.
<style name="AppTheme.PopupMenu" parent="#android:style/Widget.PopupMenu">
<item name="android:popupBackground">#color/yourcolor</item>
</style>
I would suggest wrap your toolbar in AppBarLayout and in AppBarLayout theme set your menu style.
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/app_bar"
android:theme="#style/AppTheme.AppBarOverlay">
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="?attr/colorPrimary"
app:popupTheme="#style/AppTheme.PopupOverlay"/>
</android.support.design.widget.AppBarLayout>
Here are styles.
<style name="AppTheme.AppBarOverlay" parent="ThemeOverlay.AppCompat.Light">
<!-- text color for toolbar and popup menu-->
<item name="android:textColorPrimary">#color/colorAccent</item>
<item name="popupMenuStyle">#style/AppTheme.PopupMenu</item>
<item name="android:popupMenuStyle">#style/AppTheme.PopupMenu</item>
</style>
<style name="AppTheme.PopupOverlay" parent="ThemeOverlay.AppCompat.Dark" />
<style name="AppTheme.PopupMenu" parent="#android:style/Widget.PopupMenu">
<!-- background color of popup menu-->
<item name="android:popupBackground">#color/colorBlack</item>
</style>
Finally, create your popup menu with AppBarLayout context.
AppBarLayout bar= (AppBarLayout) findViewById(R.id.app_bar);
PopupMenu p = new PopupMenu(bar.getContext(), findViewById(item.getItemId()));
For more information, read this answer.

EditText colors and DateDialog text

I'm currently developing an android app. I've just discovered something weird and I can't seem to remove it. There is 2 weird things happening:
First issue:
I can't seem to figure out why the "Mon, Jan 25, 2016" text is at the top of my DateDialog and if it's possible to remove? You can see the image below, to see my DateDialog.
You can also see the styling of the DateDialog below.
Second issue:
I have an EditText box and the colors of the two buttons at the buttom of the dialog, can't seem to change color. Which styling elements do I have to add or is there an easy solution for me to fix this??
Datedialog:
EditText box:
Styling:
<resources>
<style name="AppTheme.NoActionBar">
<item name="windowActionBar">false</item>
<item name="windowNoTitle">true</item>
<!--<item name="android:windowDrawsSystemBarBackgrounds">true</item>
<item name="android:statusBarColor">#android:color/transparent</item>-->
</style>
<style name="AppTheme" parent="Theme.AppCompat.Light">
<item name="colorPrimary">#color/MenuBar</item>
<item name="colorPrimaryDark">#color/ShadowMenuBar</item>
<item name="colorControlNormal">#color/ColorPrimaryDark</item>
<item name="colorControlActivated">#color/ColorPrimaryDark</item>
<item name="colorControlHighlight">#color/ColorPrimaryDark</item>
<item name="android:datePickerDialogTheme">#style/MyDatePickerDialogTheme</item>
</style>
<style name="MyDatePickerDialogTheme" parent="#style/Theme.AppCompat.Light.Dialog">
<item name="android:datePickerStyle">#style/MyDatePickerStyle</item>
<item name="android:colorAccent">#color/ColorPrimaryDark</item>
<item name="colorAccent">#color/ColorPrimaryDark</item>
</style>
<style name="MyDatePickerStyle" parent="#android:style/Widget.Material.Light.DatePicker">
<item name="android:headerBackground">#color/ColorPrimaryDark</item>
<item name="android:calendarTextColor">#color/ColorPrimaryDark</item>
<item name="android:dayOfWeekBackground">#color/ColorPrimaryDark</item>
<item name="android:yearListSelectorColor">#color/ColorPrimaryDark</item>
<item name="android:datePickerMode">calendar</item>
</style>
DateDialog creation code:
private void setDateTimeField() {
Date.setOnClickListener(this);
Calendar newCalendar = Calendar.getInstance();
DateDialog = new DatePickerDialog(this, new DatePickerDialog.OnDateSetListener() {
public void onDateSet(DatePicker view, int year, int monthOfYear, int dayOfMonth) {
if(view.isShown())
{
Calendar newDate = Calendar.getInstance();
newDate.set(year, monthOfYear, dayOfMonth);
}
}
},newCalendar.get(Calendar.YEAR), newCalendar.get(Calendar.MONTH), newCalendar.get(Calendar.DAY_OF_MONTH));
}

ViewPager Initial Background?

http://tinypic.com/r/2isk4tz/8
This link will provide the image for the viewpager indicator lined style.
My question is how do I get rid of the default white background and amke it transparent?
For example, to look like this : http://24.media.tumblr.com/d0816263966dcb14f4b6a655f1f6bbc0/tumblr_mwzn1tKAAU1r2wjwko1_1280.png
Here is my code by the way.
Themed Lines Code Layout:
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<android.support.v4.view.ViewPager
android:id="#+id/pager"
android:layout_width="fill_parent"
android:layout_height="0dp"
android:layout_weight="1"
/>
<com.viewpagerindicator.LinePageIndicator
android:id="#+id/indicator"
style="#style/CustomLinePageIndicator"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_weight="0.04"
android:padding="5dip"
app:lineWidth="30dp"
app:selectedColor="#FF24248F"
app:strokeWidth="4dp"
app:unselectedColor="#FF8FB28F"
/>
</LinearLayout>
Main Activity Code:
import com.viewpagerindicator.PageIndicator;
import com.viewpagerindicator.LinePageIndicator;
import android.os.Bundle;
import android.support.v4.app.FragmentActivity;
import android.support.v4.view.ViewPager;
import android.view.Menu;
import co.sav.prime.R;
public class MainActivity extends FragmentActivity {
FragmentAdapter mAdapter;
ViewPager mPager;
PageIndicator mIndicator;
int Number = 0;
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.themed_lines);
mAdapter = new FragmentAdapter(getSupportFragmentManager());
mPager = (ViewPager)findViewById(R.id.pager);
mPager.setAdapter(mAdapter);
mIndicator = (LinePageIndicator)findViewById(R.id.indicator);
mIndicator.setViewPager(mPager);
}
#Override
public boolean onCreateOptionsMenu(Menu menu) {
// Inflate the menu; this adds items to the action bar if it is present.
getMenuInflater().inflate(R.menu.main, menu);
return true;
}
Styles:
<resources xmlns:android="http://schemas.android.com/apk/res/android">
<style name="StyledIndicators" parent="#android:style/Theme.Light">
<item name="vpiCirclePageIndicatorStyle">#style/CustomCirclePageIndicator</item>
<item name="vpiLinePageIndicatorStyle">#style/CustomLinePageIndicator</item>
<item name="vpiTitlePageIndicatorStyle">#style/CustomTitlePageIndicator</item>
<item name="vpiTabPageIndicatorStyle">#style/CustomTabPageIndicator</item>
<item name="vpiUnderlinePageIndicatorStyle">#style/CustomUnderlinePageIndicator</item>
</style>
<style name="CustomTitlePageIndicator">
<item name="android:background">#18FF0000</item>
<item name="footerColor">#FFAA2222</item>
<item name="footerLineHeight">1dp</item>
<item name="footerIndicatorHeight">3dp</item>
<item name="footerIndicatorStyle">underline</item>
<item name="android:textColor">#AA000000</item>
<item name="selectedColor">#FF000000</item>
<item name="selectedBold">true</item>
</style>
<style name="CustomLinePageIndicator">
<item name="strokeWidth">4dp</item>
<item name="lineWidth">30dp</item>
<item name="unselectedColor">#FF8FB28F</item>
<item name="selectedColor">#FF24248F</item>
<item name="android:background">#android:color/transparent</item>
</style>
<style name="CustomCirclePageIndicator">
<item name="fillColor">#FF888888</item>
<item name="strokeColor">#FF000000</item>
<item name="strokeWidth">2dp</item>
<item name="radius">10dp</item>
<item name="centered">true</item>
</style>
<style name="CustomTabPageIndicator" parent="Widget.TabPageIndicator">
<item name="android:textAppearance">#style/CustomTabPageIndicator.Text</item>
<item name="android:textColor">#FF555555</item>
<item name="android:textSize">16sp</item>
<item name="android:dividerPadding">10dp</item>
<item name="android:showDividers">middle</item>
<item name="android:paddingLeft">8dp</item>
<item name="android:paddingRight">8dp</item>
<item name="android:fadingEdge">horizontal</item>
<item name="android:fadingEdgeLength">8dp</item>
</style>
<style name="CustomTabPageIndicator.Text" parent="android:TextAppearance.Medium">
<item name="android:typeface">monospace</item>
</style>
<style name="CustomUnderlinePageIndicator">
<item name="selectedColor">#FFCC0000</item>
<item name="android:background">#FFCCCCCC</item>
<item name="fadeLength">1000</item>
<item name="fadeDelay">1000</item>
</style>
</resources>

I think I got. You're using LinearLayout, your ViewPager is above your PagerIndicator, so the white color is the background color of the view. You can solve this using RelativeLayout and put:
android:layout_alignParentBottom="true"
in your PagerIndicator.
Try something like this:
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<android.support.v4.view.ViewPager
android:id="#+id/pager"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
/>
<com.viewpagerindicator.LinePageIndicator
android:id="#+id/indicator"
style="#style/CustomLinePageIndicator"
android:layout_width="fill_parent"
android:layout_height="10dp"
android:layout_alignParentBottom="true"
android:padding="5dip"
app:lineWidth="30dp"
app:selectedColor="#FF24248F"
app:strokeWidth="4dp"
app:unselectedColor="#FF8FB28F"
/>
</RelativeLayout>

How can I position my actionbar list navigation on the right side?

This image demonstrats what I need to do. I need the dropdown menu to always stay on the left next to the overflow menu icon
How can i do this?
My styles.xml
<?xml version="1.0" encoding="utf-8"?>
<resources xmlns:android="http://schemas.android.com/apk/res/android">
<!-- Variation on the Holo Light theme that styles the Action Bar -->
<style name="Theme.AndroidDevelopers" parent="Theme.Sherlock.Light">
<item name="android:actionBarItemBackground">#drawable/ad_selectable_background</item>
<item name="actionBarItemBackground">#drawable/ad_selectable_background</item>
<item name="android:popupMenuStyle">#style/MyPopupMenu</item>
<item name="popupMenuStyle">#style/MyPopupMenu</item>
<item name="android:dropDownListViewStyle">#style/MyDropDownListView</item>
<item name="dropDownListViewStyle">#style/MyDropDownListView</item>
<item name="android:actionBarTabStyle">#style/MyActionBarTabStyle</item>
<item name="actionBarTabStyle">#style/MyActionBarTabStyle</item>
<item name="android:actionDropDownStyle">#style/MyDropDownNav</item>
<item name="actionDropDownStyle">#style/MyDropDownNav</item>
<item name="android:listChoiceIndicatorMultiple">#drawable/ad_btn_check_holo_light</item>
<item name="android:listChoiceIndicatorSingle">#drawable/ad_btn_radio_holo_light</item>
<!-- <item name="android:actionOverflowButtonStyle">#style/MyOverflowButton</item> -->
</style>
<!-- style the overflow menu -->
<style name="MyPopupMenu" parent="Widget.Sherlock.Light.PopupMenu">
<item name="android:popupBackground">#drawable/ad_menu_dropdown_panel_holo_light</item>
</style>
<!-- style the items within the overflow menu -->
<style name="MyDropDownListView" parent="Widget.Sherlock.ListView.DropDown">
<item name="android:listSelector">#drawable/ad_selectable_background</item>
</style>
<!-- style for the tabs -->
<style name="MyActionBarTabStyle" parent="Widget.Sherlock.Light.ActionBar.TabBar">
<item name="android:background">#drawable/actionbar_tab_bg</item>
</style>
<!-- style the list navigation -->
<style name="MyDropDownNav" parent="Widget.Sherlock.Light.Spinner.DropDown.ActionBar">
<item name="android:background">#drawable/ad_spinner_background_holo_light</item>
<item name="android:popupBackground">#drawable/ad_menu_dropdown_panel_holo_light</item>
<item name="android:dropDownSelector">#drawable/ad_selectable_background</item>
</style>
<!--
the following can be used to style the overflow menu button
only do this if you have an *extremely* good reason to!!
-->
<!--
<style name="MyOverflowButton" parent="Widget.Sherlock.ActionButton.Overflow">
<item name="android:src">#drawable/ic_menu_view</item>
<item name="android:background">#drawable/action_button_background</item>
</style>
-->
<style name="customRatingBar" parent="#android:style/Widget.RatingBar">
<item name="android:progressDrawable" >#drawable/custom_ratingbar</item>
<item name="android:indeterminateDrawable">#drawable/money_off</item>
<item name="android:minHeight">10dip</item>
<item name="android:maxHeight">15dip</item>
<item name="android:scaleType">centerInside</item>
</style>
</resources>

As an example for implementing it as Action view, "Emanuel Moecklin" is the owner of following Code
ActionBar actionBar = getSupportActionBar();
final Context context = actionBar.getThemedContext();
final String[] entries = new String[] { "Entry 1", "Entry 2", "Entry 3" };
ArrayAdapter<String> adapter = new ArrayAdapter<String>(context,
R.layout.sherlock_spinner_item, entries);
adapter.setDropDownViewResource(R.layout.sherlock_spinner_dropdown_item);
// create ICS spinner
IcsSpinner spinner = new IcsSpinner(this, null,
R.attr.actionDropDownStyle);
spinner.setAdapter(adapter);
spinner.setOnItemSelectedListener(new OnItemSelectedListener() {
#Override
public void onItemSelected(IcsAdapterView<?> parent, View view,
int position, long id) {
Toast.makeText(context, "Item selected: " + entries[position],
Toast.LENGTH_SHORT).show();
}
#Override
public void onNothingSelected(IcsAdapterView<?> parent) {
}
});
// configure custom view
IcsLinearLayout listNavLayout = (IcsLinearLayout) getLayoutInflater()
.inflate(R.layout.abs__action_bar_tab_bar_view, null);
LinearLayout.LayoutParams params = new LinearLayout.LayoutParams(
LayoutParams.WRAP_CONTENT, LayoutParams.MATCH_PARENT);
params.gravity = Gravity.CENTER;
listNavLayout.addView(spinner, params);
listNavLayout.setGravity(Gravity.RIGHT); // <-- align the spinner to the
// right
// configure action bar
actionBar.setCustomView(listNavLayout, new ActionBar.LayoutParams(
Gravity.RIGHT));
actionBar.setDisplayShowCustomEnabled(true);

As far as I know, it is impossible to move Action bar features from the left to the right. You can, however, add a Spinner as an Action View and customize it so that it looks and behaves exactly like the Spinner from the Action bar list navigation.

Add UI components at the Right side of Actionbar using ToolBar:
Check this link for more details of ToolBar.
Screenshot attached.
toolbar.xml
<?xml version="1.0" encoding="utf-8"?>
<android.support.v7.widget.Toolbar
style="#style/ToolBarStyle"
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="?attr/colorPrimary"
android:minHeight="#dimen/abc_action_bar_default_height_material">
<RelativeLayout
android:id="#+id/rlToolBarMain"
android:layout_width="wrap_content"
android:layout_marginRight="10dp"
android:layout_marginLeft="10dp"
android:layout_height="wrap_content"
android:layout_gravity="right|center_vertical">
</RelativeLayout>
</android.support.v7.widget.Toolbar>
Style for Application
<resources>
<!-- Base application theme. -->
<style name="AppTheme" parent="Theme.AppCompat.NoActionBar">
<!-- Customize your theme here. -->
<item name="colorPrimary">#color/myPrimaryColor</item>
<item name="colorPrimaryDark">#color/myPrimaryDarkColor</item>
<item name="colorAccent">#color/myAccentColor</item>
<item name="android:textColorPrimary">#color/myTextPrimaryColor</item>
<item name="drawerArrowStyle">#style/DrawerArrowStyle</item>
<item name="android:windowBackground">#color/myWindowBackground</item>
</style>
<style name="DrawerArrowStyle" parent="Widget.AppCompat.DrawerArrowToggle">
<item name="spinBars">true</item>
<item name="color">#android:color/white</item>
</style>
<style name="ToolBarStyle" parent="">
<item name="popupTheme">#style/ThemeOverlay.AppCompat.Light</item>
<item name="theme">#style/ThemeOverlay.AppCompat.Dark.ActionBar</item>
</style>
</resources>
Include xml in activity_main.xml
<include
android:id="#+id/toolbar_actionbar"
layout="#layout/toolbar_default"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
Your Activity must be extends AppCompatActivity
on onCreate of Activity
Toolbar mToolbar = (Toolbar) findViewById(R.id.toolbar_actionbar);
setSupportActionBar(mToolbar);
getSupportActionBar().setDisplayShowHomeEnabled(true);
on onCreateView of Fragment
Toolbar mToolBar = (Toolbar) getActivity().findViewById(R.id.toolbar_actionbar);
RelativeLayout rlToolBarMain = (RelativeLayout)mToolBar.findViewById(R.id.rlToolBarMain);
Spinner mSpinner = new Spinner(getActivity());
String[] frags = new String[]{
"category1",
"category2",
"category3",
};
ArrayAdapter<String> arrayAdapter = new ArrayAdapter<String>(getActivity(),android.R.layout.simple_list_item_1,frags);
mSpinner.setAdapter(arrayAdapter);
rlToolBarMain.addView(mSpinner);
Done

Just try this ,
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="?attr/colorPrimary"
app:layout_scrollFlags="scroll|enterAlways"
app:popupTheme="#style/AppTheme.PopupOverlay"
app:title="#string/app_name">
<Spinner
android:id="#+id/Method"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_gravity="right|center_vertical"
android:layout_weight="1"
android:gravity="right|center_vertical" />
</android.support.v7.widget.Toolbar>

Develop Reference

The Android operating system is a mobile operating system that was developed by Google (GOOGL?) to be primarily used for touchscreen devices, cell phones, and tablets.

Android kitkat (Api 19) styling - android

Related

how to change the button text color on AlertDialog globally using style?

Popup menu style issue

EditText colors and DateDialog text

ViewPager Initial Background?

How can I position my actionbar list navigation on the right side?

Categories

Resources