Change position of App title in Action Bar - android

I would like to change the position of the title of my app to be on the right of my icon in my action bar (as it is in the gmail android app). Currently, the app looks like:
I would like the vertical bars to appear to the left of the app title. My current styles.xml is:
<resources>
<style name="AppTheme" parent="android:Theme.Holo.Light">
<item name="android:actionBarStyle">#style/ActionBarTheme</item>
</style>
<style name="ActionBarTheme" parent="android:Widget.Holo.Light.ActionBar.Solid.Inverse">
<item name="android:background">#color/primary</item>
<item name="android:logo">#color/transparent</item>
</style>
</resources>
and my menu xml is:
<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android" >
<item android:id="#+id/action_menu"
android:icon="#drawable/ic_menu_white_36dp"
android:title="Menu"
android:showAsAction="always"
/>
</menu>

Where is your ic_launcher_icon or the default app icon ?
Check your drawables and if its not there ,store one in it.
Then you'll definitely see your Action Bar title on the right side of your app icon.

For doing so below is my code hope it will hepl you..
actionbar.setDisplayShowCustomEnabled(true);
actionbar.setDisplayUseLogoEnabled(false);
actionbar.setDisplayShowHomeEnabled(false);
actionbar.setDisplayOptions(ActionBar.DISPLAY_SHOW_CUSTOM);
actionbar.setCustomView(getLayoutInflater().inflate(R.layout.actionbar_bg, null),
new ActionBar.LayoutParams(
ActionBar.LayoutParams.WRAP_CONTENT,
ActionBar.LayoutParams.MATCH_PARENT,
Gravity.CENTER
)
);
and create your custom view,what ever you want using xml file.
below is my xml-
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#color/btn_bg_color">
<ImageButton
android:id="#+id/left_logo"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:padding="15dp"
android:visibility="gone"
android:contentDescription="#string/app_name"
android:background="#android:color/transparent"
android:src="#drawable/refresh_btn"/>
<TextView
android:id="#+id/title"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="#string/app_name"
android:textColor="#color/white_color"
android:textSize="18sp"
android:padding="5dp"
android:layout_centerInParent="true"
android:gravity="center_horizontal"/>
<ImageButton
android:id="#+id/right_logo"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:padding="15dp"
android:layout_alignParentRight="true"
android:contentDescription="#string/app_name"
android:background="#android:color/transparent"
android:src="#drawable/logout_btn"/>
</RelativeLayout>

Related

Android ActionBar height using a custom layout

I can set my ActionBar height in my styles.xml resource file:
<style name="AppTheme" parent="Theme.MaterialComponents.Light">
<!-- Customize your theme here. -->
<item name="colorPrimary">#color/colorPrimary</item>
<item name="colorPrimaryDark">#color/colorPrimaryDark</item>
<item name="colorAccent">#color/colorAccent</item>
<item name="actionBarSize">40dp</item>
</style>
This way, my action bar is a bit smaller than the default one. But a white gap appears below the ActionBar. The content starts at the same position as if the ActionBar had the same height.
EDIT:
My layout file:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/mainMenuLayout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="top">
<FrameLayout
android:id="#+id/mmContainer"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_above="#id/mmBottomNavigation" />
<com.google.android.material.bottomnavigation.BottomNavigationView
android:id="#+id/mmBottomNavigation"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
app:menu="#menu/bottom_navigation_menu"
app:itemBackground="#color/white"
app:itemIconTint="#color/btn_nav_itam_color"
app:itemTextColor="#color/btn_nav_itam_color" />
</RelativeLayout>
EDIT 2:
I tried it on a blank Application. The actionBarSize attribute works as expected. Also there's no white gap.
My app uses a custom layout for the action bar - custom_action_bar.xml:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:padding="0dp" android:layout_margin="0dp"
android:background="#color/colorPrimary" >
<TextView
android:id="#+id/titleTvLeft"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:text="#string/app_name"
android:textColor="#color/actionBarText"
android:textSize="16sp"
android:textStyle="bold" />
<TextView
android:id="#+id/titleTvRight"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentEnd="true"
android:layout_centerVertical="true"
android:text="#string/title_bar_loggedin"
android:textColor="#color/actionBarDarkText"
android:textSize="12sp"
android:textStyle="bold" />
</RelativeLayout>
And this layout is set in the Activity:
public static void setCustomTitle(AppCompatActivity apc, String userName) {
if (apc.getSupportActionBar() != null) {
apc.getSupportActionBar().setDisplayOptions(ActionBar.DISPLAY_SHOW_CUSTOM);
apc.getSupportActionBar().setDisplayShowCustomEnabled(true);
apc.getSupportActionBar().setCustomView(R.layout.custom_action_bar);
View view = apc.getSupportActionBar().getCustomView();
TextView tvLeft = (TextView) view.findViewById(R.id.titleTvLeft);
TextView tvRight = (TextView) view.findViewById(R.id.titleTvRight);
tvLeft.setText(apc.getResources().getString(R.string.app_name));
String rightTitle = apc.getResources().getString(R.string.title_bar_loggedin) + " " + userName;
tvRight.setText(rightTitle);
}
}
Add standard height in your style or layout, example added for style.xml
<style name="AppTheme" parent="Theme.MaterialComponents.Light">
<!-- Customize your theme here. -->
<item name="colorPrimary">#color/colorPrimary</item>
<item name="colorPrimaryDark">#color/colorPrimaryDark</item>
<item name="colorAccent">#color/colorAccent</item>
<item name="android:actionBarStyle">#style/CustomActionBar</item>
</style>
<style name="CustomActionBar" parent="#android:style/Widget.Holo.Light.ActionBar">
<item name="android:actionBarSize">40dp</item>
<item name="android:background">#color/colorPrimary</item>
</style>
Set the parent layout height to "match_parent" in your layout resource file.
This is a hack but for the parent container of the content area, you can add a top margin of -8dp.
android:layout_marginTop="-8dp"
This will pull the contents up.

How to change actionbar title and subtitle font size in android?

This is what I try but nothing happen
<style name="MyCustomTheme" parent="Theme.Freshchat.Light.DarkActionBar">
<item name="titleTextStyle">#style/Style1</item>
</style>
<style name="Style1" parent="#android:style/Widget.TextView">
<item name="android:textSize">12sp</item>
</style>
For more context, I am using Freshchat chat widget and want to change the Title and Subtitle font size. Thanks!
Try this your can you Toolbar
<android.support.v7.widget.Toolbar
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/myToolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
app:titleTextAppearance="#style/ToolbarTitleTheme"
app:subtitleTextAppearance="#style/ToolbarSubtitleTheme">
</android.support.v7.widget.Toolbar>
than create Style in Style.xml
<style name="ToolbarTitleTheme" parent="#style/TextAppearance.Widget.AppCompat.Toolbar.Title">
<item name="android:textSize">20dp</item>
<<item name="android:textColor">#FFAA12</item>
<!-- include other attributes you want to change: textColor, textStyle, etc -->
</style>
<style name="ToolbarSubtitleTheme" parent="#style/TextAppearance.Widget.AppCompat.Toolbar.Subtitle">
<item name="android:textSize">14dp</item>
<item name="android:textColor">#FFAA12</item>
</style>
1>Create an XML file with name titleview.xml
Code:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#android:color/transparent" >
<TextView
android:id="#+id/title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:textSize="20sp"
android:textColor="#android:color/white"
android:maxLines="1"
android:ellipsize="end"
android:text="" />
</RelativeLayout>
2>In OnCreate method:
if(getSupportActionBar() != null) {
getSupportActionBar().setDisplayShowCustomEnabled(true);
getSupportActionBar().setDisplayShowTitleEnabled(false);
LayoutInflater inflator = LayoutInflater.from(this);
View v = inflator.inflate(R.layout.titleview, null);
//if you need to customize anything else about the text, do it here.
//I'm using a custom TextView with a custom font in my layout xml so all I need to do is set title
((TextView) v.findViewById(R.id.title)).setText(this.getTitle());
((TextView) v.findViewById(R.id.title)).setTextSize(20);
//assign the view to the actionbar
this.getSupportActionBar().setCustomView(v);
}
3>In Manifest file to your Activity Add this line
android:label="#string/room_title"
The simple way will be to create a custom_action_bar.xml layout for your action bar as follows:
<?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">
<TextView
android:id="#+id/action_bar_title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="You title"
android:textColor="#ff0"
android:textSize="14sp"
android:textStyle="bold" />
<TextView
android:id="#+id/action_bar_subtitle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Your subtitle"
android:textColor="#ff0"
android:textSize="12sp" />
</LinearLayout>
Then you have to set the layout of you custom action bar as follows:
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
getSupportActionBar().setDisplayOptions(ActionBar.DISPLAY_SHOW_CUSTOM);
getSupportActionBar().setCustomView(R.layout.custom_action_bar);
}
Using this method you will be able to easily customize your action bar.
You can use SpannableString as follows:
SpannableString s = new SpannableString(getResources().getString(R.string.manage_prescription));
s.setSpan(new TypefaceSpan(YourActivity.this, Constants.TOOLBAR_TITLE_FONT), 0, s.length(),
Spannable.SPAN_EXCLUSIVE_EXCLUSIVE);
And user this SpannableString object to set the title to your action bar.

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);

Refrencing a selector drawable from a style results blank imagebutton

I want to have a ImageButtons changing the image based on its state. (same as "like" button in nine gag and facebook apps).
I have defined a style for each of them that references a selector as a drawable but when I run the program, images doesn't appear. Can you tell me what's wrong with this approach? (sorry for my bad English)
comment_actions_style in values folder:
<style name="LikeStyle">
<item name="android:src">#drawable/like</item>
</style>
<style name="DislikeStyle">
<item name="android:src">#drawable/dislike_normal</item>
</style>
<style name="ReplyStyle">
<item name="android:src">#drawable/reply_normal</item>
</style>
<style name="ShareStyle">
<item name="android:src">#drawable/share</item>
</style>
</resources>
and like drawable in drawable folder: (other buttons are the same)
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="#drawable/like_clicked" android:state_pressed="true"/>
<!-- pressed -->
<item android:drawable="#drawable/like_focused" android:state_focused="true"/>
<!-- focused -->
<item android:drawable="#drawable/like_normal"/>
<!-- default -->
</selector>
EDIT:
I forgot to mention, I have a list view that its items are user comments and comments have buttons described above.
here is my items layout (part of it)
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_below="#id/comment_content"
android:orientation="horizontal"
>
<include
android:id="#+id/like"
android:layout_width="0dp"
android:layout_weight="1"
android:layout_height="wrap_content"
layout="#layout/comment_actions"
style="#style/LikeStyle" />
</LinearLayout>
and comment_actions layout:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/comment_action"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:paddingBottom="5dip">
<ImageButton
android:id="#+id/comment_action_img"
android:layout_width="40dp"
android:layout_height="40dp"
android:background="#android:color/transparent"
/>
<TextView
android:id="#+id/comment_action_num"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_toRightOf="#id/comment_action_img"
android:gravity="center"
android:layout_marginLeft="5dip"/>
</RelativeLayout>
These buttons also inherit from a layout if that's matter.
Here, your are setting style for comment_actions layout, and it is a Relative Layout, which won't be abled to response to your "android:src" attribute.
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_below="#id/comment_content"
android:orientation="horizontal"
>
<include
android:id="#+id/like"
android:layout_width="0dp"
android:layout_weight="1"
android:layout_height="wrap_content"
layout="#layout/comment_actions"
style="#style/LikeStyle" /> <!--here,you are setting a style for the RelativeLayout -->
</LinearLayout>

Changing TabView default colours and search bar default colours

okay i'm looking for a way to be able to change the orange colour that appears when you click on a tab in Android TabView
and change the orange border colour around a search bar... anyideas how to do something like that?
thats my main tab View
<TabHost xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#android:id/tabhost"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<LinearLayout
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<TabWidget
android:id="#android:id/tabs"
android:layout_width="fill_parent"
android:layout_height="wrap_content" />
<FrameLayout
android:id="#android:id/tabcontent"
android:background="#drawable/gradient_bg"
android:layout_width="fill_parent"
android:layout_height="fill_parent"/>
</LinearLayout>
and i have this for my search bar
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical">
<LinearLayout
android:orientation="horizontal"
android:layout_width="fill_parent"
android:layout_height="wrap_content">
<EditText
android:id="#+id/searchText"
android:hint="#string/Search"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"/>
<ImageButton
android:id="#+id/searchButton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:contentDescription="#string/Search"
android:src="#drawable/search"
android:onClick="search"/>
</LinearLayout>
<ListView
android:id="#android:id/list"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:divider="#b5b5b5"
android:dividerHeight="1dp"
android:listSelector="#drawable/list_selector" />
any ideas ???
Thanks alot for all ur help!!!!
You need to use themes. You can setup a style.xml in res/values and inherit from Holo and override the properties you need to. I did this for the Tab's in the action bar:
<?xml version="1.0" encoding="utf-8"?>
<resources>
<!-- the theme applied to the application or activity -->
<style name="Theme.Mine" parent="android:style/Theme.Holo">
<item name="android:actionBarTabStyle">#style/MyActionBarTabStyle</item>
<item name="android:actionDropDownStyle">#style/MyDropDownNav</item>
<item name="android:selectableItemBackground">#drawable/ad_selectable_background</item>
<item name="android:popupMenuStyle">#style/MyPopupMenu</item>
<item name="android:dropDownListViewStyle">#style/MyDropDownListView</item>
<item name="android:listChoiceIndicatorMultiple">#drawable/ad_btn_check_holo_light</item>
<item name="android:listChoiceIndicatorSingle">#drawable/ad_btn_radio_holo_light</item>
</style>
<style name="MyActionBarTabStyle" >
<item name="android:background">#drawable/actionbar_tab_bg</item>
<item name="android:textColorHighlight">#FF5555</item>
<item name="android:paddingLeft">10dip</item>
<item name="android:paddingRight">10dip</item>
</style>
<style name="TableCellStyle" parent="Theme.Mine">
<item name="android:textColor">#000000</item>
<item name="android:textSize">15sp</item>
</style>
</resources>
Then you can reference this theme in your manifest file. You can read all about it here: http://developer.android.com/guide/topics/ui/themes.html

Categories

Resources