ViewPager Initial Background?

ViewPager Initial Background? - android

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>

Related

SearchView as an MenuItem in Fragment

I'm implementing an material searchView in fragment menu item . I use the library - https://github.com/MiguelCatalan/MaterialSearchView as my searchView .
I have implemented as per this and finally my output looks like this :
I want to take this searchview into the header. How do i acheive it ??
My Code :
SearchActivity.java
public class SearchActivity extends Fragment{
MaterialSearchView search_view;
#Override
public View onCreateView(LayoutInflater inflater, #Nullable ViewGroup container, #Nullable Bundle savedInstanceState) {
setHasOptionsMenu(true);
return inflater.inflate(R.layout.activity_search, container, false);
}
#Override
public void onViewCreated(View view, #Nullable Bundle savedInstanceState) {
super.onViewCreated(view, savedInstanceState);
getActivity().setTitle("Search");
}
#Override
public void onCreateOptionsMenu(Menu menu, MenuInflater inflater) {
inflater.inflate(R.menu.search_menu, menu);
search_view = (MaterialSearchView) getView().findViewById(R.id.search_view);
MenuItem item = menu.findItem(R.id.action_search);
search_view.setMenuItem(item);
}
}
activity_search.xml
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/container"
android:layout_width="match_parent"
android:layout_height="match_parent">
<FrameLayout
android:id="#+id/toolbar_container"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"/>
<com.miguelcatalan.materialsearchview.MaterialSearchView
android:id="#+id/search_view"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
</FrameLayout>
</FrameLayout>
searchmenu.xml
<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto">
<item
android:id="#+id/action_search"
android:icon="#drawable/ic_action_action_search"
android:orderInCategory="100"
android:title="#string/abc_search_hint"
app:showAsAction="always" />
</menu>
styles.xml
<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>
<item name="windowActionModeOverlay">true</item>
</style>
<style name="AppTheme.NoActionBar">
<item name="windowActionBar">false</item>
<item name="windowNoTitle">true</item>
<item name="windowActionModeOverlay">true</item>
</style>
<style name="AppTheme.AppBarOverlay" parent="ThemeOverlay.AppCompat.Dark.ActionBar" />
<style name="AppTheme.PopupOverlay" parent="ThemeOverlay.AppCompat.Light" />
</resources>

set <item name="windowActionModeOverlay">true</item>
in your app Theme. like
<style name="MyTheme" parent="Theme.AppCompat.Light.NoActionBar">
.......
.......
<item name="windowActionModeOverlay">true</item>
</style>

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.

Define TabLayout style in theme

I have two different styles of TabLayout in my app:
<style name="TabLayoutPower" parent="Widget.Design.TabLayout">
<item name="tabSelectedTextColor">#android:color/white</item>
<item name="tabTextColor">#android:color/white</item>
</style>
<style name="TabLayoutFree" parent="Widget.Design.TabLayout">
<item name="tabSelectedTextColor">#android:color/black</item>
<item name="tabTextColor">#android:color/black</item>
</style>
How can I define the default TabLayout style for a theme? I cannot find any info which item name should I use to build my theme. I'd like to add the TabLayout the same way I added my listview:
<style name="Free" parent="Theme.AppCompat.Light.DarkActionBar">
<item name="colorPrimary">#color/black</item>
<item name="colorPrimaryDark">#color/black</item>
<item name="colorAccent">#color/main_red</item>
<item name="android:windowBackground">#color/main_bg_light</item>
<item name="android:listViewStyle">#style/MyListView</item>
</style>

For Support Library TabLayout, you can set tabStyle attribute in your theme:
<style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
<!-- ... -->
<item name="tabStyle">#style/AppTheme.TabLayout</item>
</style>
<style name="AppTheme.TabLayout" parent="Widget.Design.TabLayout">
<item name="tabSelectedTextColor">#android:color/white</item>
<item name="tabTextColor">#android:color/white</item>
</style>

If you wan to use 2 different styles for your TabLayout based on theme of your application then you should define your style inside attrs.xml
here is the Sample code for that
First you create an attrs.xml file ( Like this )
<?xml version="1.0" encoding="utf-8"?>
<resources>
<attr name="textColor" format="reference|color" />
<attr name="backColor" format="reference|color" />
<attr name="myTabStyle" format="reference" />
</resources>
define various theme as per your requirements inside styles.xml
Note: i have used 3 different themes for demo
<resources>
<!-- Base application theme. -->
<style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
<item name="colorPrimary">#color/colorPrimary</item>
<item name="colorPrimaryDark">#color/colorPrimaryDark</item>
<item name="colorAccent">#color/colorAccent</item>
<item name="tabStyle">#style/TabLayoutPower</item>
<item name="textColor">#android:color/white</item>
<item name="backColor">#color/colorPrimary</item>
</style>
<style name="AppTheme2" parent="Theme.AppCompat.Light.DarkActionBar">
<item name="colorPrimary">#android:color/holo_green_dark</item>
<item name="colorPrimaryDark">#android:color/white</item>
<item name="colorAccent">#android:color/holo_blue_dark</item>
<item name="textColor">#android:color/white</item>
<item name="tabStyle">#style/TabLayoutFree</item>
<item name="backColor">#FF00</item>
</style>
<style name="AppTheme3" parent="Theme.AppCompat.Light.DarkActionBar">
<item name="colorPrimary">#ff00</item>
<item name="colorPrimaryDark">#ff0</item>
<item name="colorAccent">#0a91d4</item>
<item name="tabStyle">#style/TabLayoutNew</item>
<item name="textColor">#FF00</item>
<item name="backColor">#android:color/white</item>
</style>
<style name="TabLayoutPower" parent="Widget.Design.TabLayout">
<item name="tabSelectedTextColor">#android:color/white</item>
<item name="tabTextColor">#android:color/white</item>
</style>
<style name="TabLayoutFree" parent="Widget.Design.TabLayout">
<item name="tabSelectedTextColor">#android:color/holo_blue_bright</item>
<item name="tabTextColor">#android:color/holo_blue_bright</item>
</style>
<style name="TabLayoutNew" parent="Widget.Design.TabLayout">
<item name="tabSelectedTextColor">#android:color/holo_green_dark</item>
<item name="tabTextColor">#android:color/holo_green_dark</item>
</style>
</resources>
Now use this style in your TabLayout like this inside layout.xml files
Use like this style="?myTabStyle" it will select style based on current theme of your application
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<Button
android:id="#+id/btnThemeOne"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="Theme One" />
<Button
android:id="#+id/btnThemeTwo"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="Theme Two" />
<Button
android:id="#+id/btnThemeThree"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="Theme Three" />
</LinearLayout>
<android.support.design.widget.TabLayout
android:id="#+id/tabs"
style="?myTabStyle"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:tabGravity="fill"
android:background="#color/colorAccent"
app:tabMode="fixed" />
<android.support.v4.view.ViewPager
android:id="#+id/viewpager"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior" />
</LinearLayout>
sample code of TabsActivity to change theme
import android.os.Bundle;
import android.support.design.widget.TabLayout;
import android.support.v4.app.Fragment;
import android.support.v4.app.FragmentManager;
import android.support.v4.app.FragmentPagerAdapter;
import android.support.v4.view.ViewPager;
import android.support.v7.app.AppCompatActivity;
import android.view.View;
import android.widget.Button;
import android.widget.Toast;
import java.util.ArrayList;
import java.util.List;
public class TabsActivity extends AppCompatActivity {
PrefManager prefManager;
private TabLayout tabLayout;
private ViewPager viewPager;
private Button btnThemeOne, btnThemeTwo, btnThemeThree;
#Override
protected void onCreate(Bundle savedInstanceState) {
prefManager = new PrefManager(this);
getTheme().applyStyle(prefManager.getTheme(), true);
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_tabs);
btnThemeOne = findViewById(R.id.btnThemeOne);
btnThemeOne.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View view) {
Toast.makeText(TabsActivity.this, "Applying theme one", Toast.LENGTH_SHORT).show();
prefManager.setTheme(R.style.AppTheme);
recreate();
}
});
btnThemeTwo = findViewById(R.id.btnThemeTwo);
btnThemeTwo.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View view) {
Toast.makeText(TabsActivity.this, "Applying theme two", Toast.LENGTH_SHORT).show();
prefManager.setTheme(R.style.AppTheme2);
recreate();
}
});
btnThemeThree = findViewById(R.id.btnThemeThree);
btnThemeThree.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View view) {
Toast.makeText(TabsActivity.this, "Applying theme three", Toast.LENGTH_SHORT).show();
prefManager.setTheme(R.style.AppTheme3);
recreate();
}
});
viewPager = findViewById(R.id.viewpager);
setupViewPager(viewPager);
tabLayout = findViewById(R.id.tabs);
tabLayout.setupWithViewPager(viewPager);
}
private void setupViewPager(ViewPager viewPager) {
ViewPagerAdapter adapter = new ViewPagerAdapter(getSupportFragmentManager());
adapter.addFragment(new OneFragment(), "ONE");
adapter.addFragment(new OneFragment(), "TWO");
adapter.addFragment(new OneFragment(), "THREE");
viewPager.setAdapter(adapter);
}
class ViewPagerAdapter extends FragmentPagerAdapter {
private final List<Fragment> mFragmentList = new ArrayList<>();
private final List<String> mFragmentTitleList = new ArrayList<>();
public ViewPagerAdapter(FragmentManager manager) {
super(manager);
}
#Override
public Fragment getItem(int position) {
return mFragmentList.get(position);
}
#Override
public int getCount() {
return mFragmentList.size();
}
public void addFragment(Fragment fragment, String title) {
mFragmentList.add(fragment);
mFragmentTitleList.add(title);
}
#Override
public CharSequence getPageTitle(int position) {
return mFragmentTitleList.get(position);
}
}
}
PrefManager class to save theme info
import android.content.Context;
import android.content.SharedPreferences;
public class PrefManager {
// Shared preferences file name
private final String PREF_NAME = "theme-pref";
private final String THEME = "theme";
SharedPreferences pref;
SharedPreferences.Editor editor;
public PrefManager(Context context) {
pref = context.getSharedPreferences(PREF_NAME, 0);
editor = pref.edit();
}
public int getTheme() {
return pref.getInt(THEME, R.style.AppTheme);
}
public void setTheme(int themeId) {
editor.putInt(THEME, themeId);
editor.commit();
}
}
you can check the output video of above code
https://www.youtube.com/watch?v=uup072IDGd0

You can find that name in Android theme -
<item name="android:tabWidgetStyle">#style/Your.Style</item>

<style name="Base.Widget.Design.TabLayout" parent="">
<item name="tabSelectedTextColor">#android:color/white</item>
<item name="tabTextColor">#android:color/white</item>
</style>
<style name="Free" parent="Theme.AppCompat.Light.DarkActionBar">
<item name="colorPrimary">#color/black</item>
<item name="colorPrimaryDark">#color/black</item>
<item name="colorAccent">#color/main_red</item>
<item name="android:windowBackground">#color/main_bg_light</item>
<item name="android:listViewStyle">#style/MyListView</item>
<item name="android:tabWidgetStyle">#style/Base.Widget.Design.TabLayout</item>
</style>

Change color in PopMenu (Setting)

I need to change color of PopMenu (Setting). I updated style.xml but didn't work. Then a try to change color of Item, didn't work too.
I need a little grey background and white TextColor.
MyActivity.java extends ActionBarActivity
#Override
public boolean onCreateOptionsMenu(Menu menu) {
getMenuInflater().inflate(R.menu.main, menu);
MenuItem item = menu.findItem(R.id.file);
mShareActionProvider = (ShareActionProvider) MenuItemCompat.getActionProvider(item);
mShareActionProvider.setOnShareTargetSelectedListener(this);
item.setOnMenuItemClickListener(new MenuItem.OnMenuItemClickListener() {
#Override
public boolean onMenuItemClick(MenuItem item) {
openShare();
return false;
}
});
return true;
}
MyActivity_layout.xml
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/action_bar_background"
app:theme="#style/ToolbarTheme"
app:popupTheme="#style/Theme.AppCompat"
>
main.xml(menu)
<menu xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
tools:context="com.app.MyActivity">
<item android:id="#+id/file"
android:title="Setting"
android:icon="#drawable/ic_setting"
app:actionProviderClass=
"android.support.v7.widget.ShareActionProvider">
</item>
</menu>
styles.xml
<resources xmlns:android="http://schemas.android.com/apk/res/android">
<style name="Theme.AppCompat.Light.NoActionBar" parent="#style/Theme.AppCompat.Light">
<item name="android:windowNoTitle">true</item>
<item name="windowActionBar">false</item>
</style>
<style name="AppTheme.Base" parent="Theme.AppCompat.Light.NoActionBar">
<item name="colorPrimary">#color/primary</item>
<item name="colorPrimaryDark">#color/primaryDark</item>
<item name="android:popupBackground">#android:color/white</item>
</style>
<style name="AppTheme" parent="AppTheme.Base">
</style>
<style name="ToolbarTheme" parent="Theme.AppCompat">
<item name="android:windowNoTitle">true</item>
<item name="android:textColorPrimary">#color/action_bar_text</item>
<item name="actionMenuTextColor">#color/action_bar_text</item>
<item name="android:textColorSecondary">#color/action_bar_text</item>
<item name="android:layout_gravity">center_horizontal</item>
</style>
</resources>
Manifest.xml
<application
android:allowBackup="true"
android:icon="#mipmap/ic_app"
android:label="#string/app_name"
android:theme="#style/AppTheme" >
...
</application>

It's ok, i just updated :
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/action_bar_background"
app:theme="#style/AppTheme"
app:popupTheme="#style/AppTheme"
>

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.

ViewPager Initial Background? - android

Related

SearchView as an MenuItem in Fragment

Popup menu style issue

Define TabLayout style in theme

Change color in PopMenu (Setting)

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

Categories

Resources