Im adding a Hamburger Icon on the lesft side of my ToolBar but when Im running it the app crashes
Here is my xml file
<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:fitsSystemWindows="true"
android:orientation="vertical">
<android.support.design.widget.AppBarLayout
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="#dimen/abc_action_bar_default_height_material"
android:background="?attr/colorPrimary"
android:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar">
<android.support.v7.widget.Toolbar
android:layout_width="match_parent"
android:layout_height="match_parent">
<TextView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:text="Test"
android:background="#color/colorPrimary"
android:textColor="#color/black"
android:textSize="18dp"
android:gravity="center"/>
</android.support.v7.widget.Toolbar>
</android.support.design.widget.AppBarLayout>
<android.support.v4.widget.DrawerLayout
android:id="#+id/drawer_layout"
android:layout_width="match_parent"
android:layout_height="match_parent">
<!-- Real content goes here -->
<FrameLayout
android:id="#+id/content"
android:layout_width="match_parent"
android:layout_height="match_parent">
<TextView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:textColor="#color/black"
android:text="Test"/>
</FrameLayout>
<!-- The navigation drawer -->
<android.support.design.widget.NavigationView
android:id="#+id/navigation"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_gravity="start"
app:headerLayout="#layout/navigation_header"
app:menu="#menu/navigation_menu"/>
</android.support.v4.widget.DrawerLayout>
</LinearLayout>
and here is my java class
import android.support.v4.widget.DrawerLayout;
import android.support.v7.app.ActionBarDrawerToggle;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.support.v7.widget.Toolbar;
public class test extends AppCompatActivity {
private DrawerLayout sideBar;
private ActionBarDrawerToggle sideBarToggle;
private Toolbar actionToolbar;
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_test);
/* Side Bar */
actionToolbar = (Toolbar) findViewById(R.id.toolbar);
setSupportActionBar(actionToolbar);
sideBar = (DrawerLayout) findViewById(R.id.navigation);
sideBarToggle = new ActionBarDrawerToggle(this, sideBar, R.string.Open, R.string.Close);
sideBar.addDrawerListener(sideBarToggle);
sideBarToggle.syncState();
getSupportActionBar().setDisplayHomeAsUpEnabled(true);
}
}
Does it have any conflict with my custom Toolbar?
I dont know whats wrong and Im trying to search everywhere but still no luck. I dont know what or where to fix. thnx for the future help
Updated
<android.support.v7.widget.Toolbar
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/toolbar"
>
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="#dimen/abc_action_bar_default_height_material"
android:background="?attr/colorPrimary"
android:theme="#style/Theme.AppCompat.DayNight.NoActionBar">
<TextView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#color/colorPrimary"
android:gravity="center"
android:text="Test"
android:textColor="#color/black"
android:textSize="18dp" />
</android.support.design.widget.AppBarLayout>
</android.support.v7.widget.Toolbar>
Added style.xml
<resources>
<!-- Base application theme. -->
<style name="AppTheme" parent="Theme.AppCompat.DayNight.NoActionBar">
<!-- Customize your theme here. -->
<item name="colorPrimary">#color/colorPrimary</item>
<item name="colorPrimaryDark">#color/colorPrimaryDark</item>
<item name="colorAccent">#color/colorAccent</item>
</style>
</resources>
style.xml
<resources>
<style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
<!-- Customize your theme here. -->
<item name="colorPrimary">#color/colorPrimary</item>
<item name="colorPrimaryDark">#color/colorPrimaryDark</item>
<item name="colorAccent">#color/colorAccent</item>
</style>
</resources>
main_activity.xml
<?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"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context="im.opriday.customlistview.MainActivity">
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize">
<android.support.v7.widget.Toolbar
android:id="#+id/toolbr"
android:layout_width="match_parent"
android:layout_height="match_parent"/>
</android.support.design.widget.AppBarLayout>
</RelativeLayout>
MainActivity
import android.support.v7.widget.Toolbar instead of import android.widget.Toolbar
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
Toolbar toolbar = (Toolbar) findViewById(R.id.toolbr);
setSupportActionBar(toolbar);
getSupportActionBar().setTitle("Hello");
getSupportActionBar().setDisplayHomeAsUpEnabled(true);
getSupportActionBar().setDisplayShowHomeEnabled(true);
getSupportActionBar().setHomeAsUpIndicator(R.drawable.ic_menu_black_24dp);
}
This code would be correct. No need in extra TextView
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="#dimen/abc_action_bar_default_height_material"
android:background="?attr/colorPrimary"
android:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar">
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="match_parent"/>
</android.support.design.widget.AppBarLayout>
You do not have identifier(android:id="#+id/toolbar") mentioned for the toolbar which you are referencing in your code. Since its not found it would return exception.
<android.support.design.widget.AppBarLayout
android:id="#+id/appBarLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar">
<android.support.v7.widget.Toolbar
android:layout_width="match_parent"
android:id="#+id/toolbar" <!---missing-->
android:layout_height="200dp">
<TextView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:text="Test"
android:background="#color/colorPrimary"
android:textColor="#color/black"
android:textSize="18dp"
android:gravity="center"/>
</android.support.v7.widget.Toolbar>
</android.support.design.widget.AppBarLayout>
Your style.xml should have parent with ActionBar like ThemeOverlay.AppCompat.Dark.ActionBar and not NoActionBar as you have right now
<resources>
<!-- Base application theme. -->
<style name="AppTheme" parent="ThemeOverlay.AppCompat.Dark.ActionBar">
Please follow this tutorial for guidance link
Your layout must be in this order.
<DrawerLayout>
<AppBarLayout>
<Toolbar>
// Toolbar content
</Toolbar>
</AppBarLayout>
<NavigationView />
</DrawerLayout>
You need to include the toolbar in your ActionBarDraweToggle constructor parameter if you want a default hamburger menu.
sideBarToggle = new ActionBarDrawerToggle(this, sideBar, actionToolbar , R.string.Open, R.string.Close);
Related
I am trying to make collapsing toolbar with TabLayout as follows
https://i.stack.imgur.com/76m5h.gif
but my result is like this
as you can see the toolbar is not showing at all.
in java I am setting toolbar as actionbar using
setSupportActionBar(toolbar);
I tried many so answers and other sites but not able to solve my problem.
below is the xml I am using.
<?xml version="1.0" encoding="utf-8"?>
<android.support.design.widget.CoordinatorLayout 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"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
android:orientation="vertical"
tools:context=".MainActivity">
<android.support.design.widget.AppBarLayout
android:id="#+id/appBar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:fitsSystemWindows="true"
android:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar">
<android.support.design.widget.CollapsingToolbarLayout
android:id="#+id/collapsingToolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:fitsSystemWindows="true"
app:contentScrim="?attr/colorPrimary"
app:expandedTitleMarginEnd="64dp"
app:expandedTitleMarginStart="48dp"
app:layout_scrollFlags="scroll|exitUntilCollapsed">
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
app:layout_collapseMode="pin"
app:popupTheme="#style/ThemeOverlay.AppCompat.Light" />
</android.support.design.widget.CollapsingToolbarLayout>
</android.support.design.widget.AppBarLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/bg_main"
android:orientation="vertical">
<com.gigamole.navigationtabstrip.NavigationTabStrip
android:id="#+id/nts_strip"
android:layout_width="match_parent"
android:layout_height="30dp"
android:layout_gravity="top"
android:background="#color/colorPrimary"
app:layout_collapseMode="parallax"
app:nts_active_color="#color/white"
app:nts_animation_duration="300"
app:nts_color="#color/white"
app:nts_corners_radius="1.5dp"
app:nts_inactive_color="#color/white_transparent"
app:nts_titles="#array/nts_titles" />
<android.support.v4.view.ViewPager
android:id="#+id/pager_photos"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:background="#color/white_transparent" />
</LinearLayout>
</android.support.design.widget.CoordinatorLayout>
here is the styles.xml
<resources>
<!-- Base application theme. -->
<style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
<!-- Customize your theme here. -->
<item name="colorPrimary">#color/colorPrimary</item>
<item name="colorPrimaryDark">#color/colorPrimaryDark</item>
<item name="colorAccent">#color/colorAccent</item>
</style>
</resources>
Please let me know if you need anything else.
CoordinatorLayout is a FrameLayout, thus the last view in order overlaps the first ones.
Add app:layout_behavior="#string/appbar_scrolling_view_behavior" to LinearLayout to anchor it to the bottom of AppBarLayout.
you can do this with default android tabbed activity from gallery. For this right clickon package where you want to create->click on new navigate to gallery->choose Tabbed activity -> in the window choose Navigation style as Action bar tabs(with viewpager)
I have a simple CollapsingToolbarLayout. Everything works fine and the statusbar is transparent before scrolling the page, as expected here(transparent):
The problem shows up when I transfer CoordinatorLayout tag and its content which includes CollapsingToolbarLayout, from activity_main.xml to a fragment, the statusbar isn't transparent anymore! why?! I didn't change any part of code, just copied piece of code and pasted it in the fragment here(not transparent anymore):
Here is the code:
MainActivity.java
public class MainActivity extends AppCompatActivity implements TestFragment.OnFragmentInteractionListener {
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
if (savedInstanceState == null) {
getSupportFragmentManager().beginTransaction()
.add(R.id.main_fragment, new TestFragment())
.commit();
}
}
}
activity_main.xml
<android.support.v4.widget.DrawerLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/drawer_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
tools:context=".MainActivity">
<FrameLayout
android:id="#+id/main_fragment"
android:fitsSystemWindows="true"
android:layout_width="match_parent"
android:layout_height="match_parent">
</FrameLayout>
</android.support.v4.widget.DrawerLayout>
fragment_test.xml
<android.support.design.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/main_content"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
tools:context=".TestFragment">
<android.support.design.widget.AppBarLayout
android:id="#+id/appbar"
android:layout_width="match_parent"
android:layout_height="256dp"
android:fitsSystemWindows="true"
android:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar">
<android.support.design.widget.CollapsingToolbarLayout
app:contentScrim="#color/colorPrimary"
app:layout_scrollFlags="scroll|exitUntilCollapsed"
android:layout_width="match_parent"
android:layout_height="match_parent"
>
<ImageView
app:layout_collapseMode="pin"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
android:scaleType="centerCrop"
android:src="#drawable/toolbar_bg" />
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
app:layout_collapseMode="pin"
app:layout_scrollFlags="scroll|enterAlways"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:popupTheme="#style/AppTheme.PopupOverlay"
android:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar"/>
</android.support.design.widget.CollapsingToolbarLayout>
</android.support.design.widget.AppBarLayout>
<android.support.v4.widget.NestedScrollView
app:layout_behavior="#string/appbar_scrolling_view_behavior"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_gravity="fill_vertical"
app:behavior_overlapTop="32dp"
android:background="#color/main_bg">
</android.support.v4.widget.NestedScrollView>
<android.support.design.widget.FloatingActionButton
app:fabSize="normal"
app:layout_anchor="#id/appbar"
app:layout_anchorGravity="bottom|right"
app:srcCompat="#drawable/ic_add_black_24dp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="16dp"
android:onClick="FABTouched"
android:tint="#color/main_bg"
/>
</android.support.design.widget.CoordinatorLayout>
styles.xml
<style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
<!-- 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:statusBarColor">#android:color/transparent</item>
</style>
<style name="AppTheme.AppBarOverlay" parent="ThemeOverlay.AppCompat.Dark.ActionBar" />
<style name="AppTheme.PopupOverlay" parent="ThemeOverlay.AppCompat.Light" />
Change FrameLayout to a CoordinatorLayout.
In order to get action-buttons into my toolbar, I have implemented a custom-toolbar in which the layout with the button images can be defined. In the activity_main layout file, I refer to this custom-toolbar layout via an include instruction.
It works to the extend that now in 1 line at the top of the action bar both contents appear: My program title and the overflow menu icon PLUS the button from the custom-toolbar. The problem is that below this line a second empty row appears with no content. Means, the height of the action bar is doubled and this unwanted area is overlapping my canvas. Here the screenshot of the phenomena:
I have searched for documents addressing this but did not find a mapping case. Furthermore I have tried all kind of constellations in my layout file (e.g. in respect to the postion of the include instruction) but did not achieve a Change. I also tried with different sizes of the image file without a Change. The current size is 3K with 80x49 Pixel.
Here my code which is reduced to show just the case relevant lines:
import android.os.Bundle;
import android.support.v7.app.AppCompatActivity;
import android.support.v7.widget.Toolbar;
import android.view.Menu;
import android.view.View;
public class MainActivity extends AppCompatActivity {
private Toolbar toolbar;
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);
setSupportActionBar(toolbar);
}
#Override
public boolean onCreateOptionsMenu(Menu menu) {
getMenuInflater().inflate(R.menu.menu_main, menu);
return true;
}
public void on_distance_waiting_Click(View view) {
}
}
The main layout:
<android.support.design.widget.CoordinatorLayout
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"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context="com.pm.pmactionbaricon.MainActivity">
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:theme="#style/AppTheme.AppBarOverlay"
android:orientation="vertical">
<include layout="#layout/custom_toolbar" />
<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>
</android.support.design.widget.CoordinatorLayout>
The custom-toolbar layout:
<android.support.v7.widget.Toolbar xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
app:layout_collapseMode="pin"
android:id="#+id/toolbar"
android:layout_height="?attr/actionBarSize"
android:padding="0dp"
android:layout_width="match_parent"
android:background="#android:color/transparent"
android:fitsSystemWindows="true"
android:orientation="horizontal">
<RelativeLayout
android:layout_width="310dp"
android:layout_height="wrap_content" >
<Button
android:id="#+id/button1"
android:background="#drawable/distance_waiting_small"
android:layout_width="100dp"
android:layout_height="wrap_content"
style="?android:attr/buttonBarButtonStyle"
android:title="#string/Distance"
android:layout_alignParentTop="true"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"
android:onClick="on_distance_waiting_Click"/>
</RelativeLayout>
</android.support.v7.widget.Toolbar>
The style file:
<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="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" />
<style name="ToolbarTheme" parent="#style/ThemeOverlay.AppCompat.Dark.ActionBar">
<item name="android:textColorPrimary">#android:color/holo_blue_light</item>
<item name="actionMenuTextColor">#android:color/holo_green_light</item>
</style>
</resources>
Here also the used Image:
When I work with the Layouts in the design mode, I can recognize that the regular toolbar element (not the custom-toolbar) seems to be responsible for the unwanted area. The following 3 screenshots might help to Highlight this. It is also strange that the appearance here is different from the result on the device as shown at the beginning.
The activity layout (consider what is selected in the right window):
The activity layout with (Standard) toolbar selected:
The custom toolbar:
So, what is causing this unwanted area below the actionbar?
In your activity_main.xml remove the extra toolbar element:
<android.support.design.widget.CoordinatorLayout
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"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context="com.pm.pmactionbaricon.MainActivity">
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:theme="#style/AppTheme.AppBarOverlay"
android:orientation="vertical">
<include layout="#layout/custom_toolbar" />
</android.support.design.widget.AppBarLayout>
</android.support.design.widget.CoordinatorLayout>
In custom_toolbar.xml layout make changes as shown below:
<android.support.v7.widget.Toolbar xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
app:layout_collapseMode="pin"
android:id="#+id/toolbar"
android:layout_height="?attr/actionBarSize"
android:padding="0dp"
app:popupTheme="#style/AppTheme.PopupOverlay"
android:layout_width="match_parent"
android:background="?attr/colorPrimary"
android:orientation="horizontal">
<RelativeLayout
android:layout_width="310dp"
android:layout_height="wrap_content">
<Button
android:id="#+id/button1"
android:background="#drawable/distance_waiting_small"
android:layout_width="100dp"
android:layout_height="wrap_content"
style="?android:attr/buttonBarButtonStyle"
android:title="#string/Distance"
android:layout_alignParentTop="true"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"
android:onClick="on_distance_waiting_Click"/>
</RelativeLayout>
</android.support.v7.widget.Toolbar>
Also, make sure that your activity tag has this attribute set in the manifest file.
android:theme="#style/AppTheme.NoActionBar"
I am developing an app in which I have window default action bar but I want to remove that and want to add toolbar instead. How can I add that
Code for removing action bar:
<activity
android:name=".CMainActivity"
android:screenOrientation="portrait"
android:theme="#style/Theme.AppCompat.Light.NoActionBar"
/>
I am extending AppCompatActivity
// navigation bar code
m_Drawer = (DrawerLayout) findViewById(R.id.drawer_layout);//finding id of drawerlayout
s_drawerToggle = new ActionBarDrawerToggle(
this, m_Drawer, m_Toolbar, R.string.navigation_drawer_open, R.string.navigation_drawer_close);
m_Drawer.setDrawerListener(s_drawerToggle);
m_Drawer.setScrimColor(getResources().getColor(android.R.color.transparent));
s_drawerToggle.syncState();
<android.support.v4.widget.DrawerLayout
android:id="#+id/drawer_layout"
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"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
tools:openDrawer="start">
<LinearLayout
android:id="#+id/container_toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="?attr/colorPrimary"
android:titleTextColor="#FFFF"
app:layout_scrollFlags="scroll|enterAlways"
tools:ignore="UnusedAttribute">
</android.support.v7.widget.Toolbar>
<android.support.design.widget.TabLayout
android:id="#+id/tab_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/primary"
android:minHeight="?attr/actionBarSize"
app:tabIndicatorColor="#android:color/white"
app:tabIndicatorHeight="2dp"
app:tabTextAppearance="?android:textAppearanceMedium"
tools:ignore="UnusedAttribute"/>
<android.support.v4.view.ViewPager
android:id="#+id/pager"
android:layout_width="match_parent"
android:layout_height="fill_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior"/>
</LinearLayout>
<android.support.design.widget.NavigationView
android:id="#+id/nav_view"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_gravity="start"
android:fitsSystemWindows="true"
app:headerLayout="#layout/nav_header_main"
app:menu="#menu/activity_main_drawer"
tools:ignore="PrivateResource"/>
In your styles.xml set AppTheme to NoActionBar like below -
<style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
Then in your activity
Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);
setSupportActionBar(toolbar);
and add this toolbar in your layout.xml file like below -
<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/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="#color/primaryColor" />
Add this code to your xml layout to add a toolbar:
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:background="?attr/colorPrimary"
android:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar"
app:popupTheme="#style/ThemeOverlay.AppCompat.Light"/>
Then in your Java class:
Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);
setSupportActionBar(toolbar);
getSupportActionBar().setTitle("title");
To remove default action bar, in your manifest file add
<android:theme="#android:style/Theme.NoTitleBar">
or in your styles.xml add:
<style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
place this code in activity xml file:
<?xml version="1.0" encoding="utf-8"?>
<android.support.design.widget.CoordinatorLayout
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" android:layout_width="match_parent"
android:layout_height="match_parent" android:fitsSystemWindows="true"
tools:context="com.ideabiz.riderapplication.ui.KmsActivity">
<android.support.design.widget.AppBarLayout android:layout_width="match_parent"
android:layout_height="wrap_content" android:theme="#style/AppTheme.AppBarOverlay">
</android.support.design.widget.AppBarLayout>
<include layout="#layout/content_kms" />
</android.support.design.widget.CoordinatorLayout>
place this code in content xml 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"
xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent"
android:layout_height="match_parent" android:paddingBottom="#dimen/activity_vertical_margin"
android:paddingLeft="#dimen/activity_horizontal_margin"
android:paddingRight="#dimen/activity_horizontal_margin"
android:paddingTop="#dimen/activity_vertical_margin"
tools:context="com.ideabiz.riderapplication.ui.KmsActivity"
tools:showIn="#layout/activity_kms">
place this in java file:
ActionBar actionBar = getSupportActionBar();
actionBar.setDisplayHomeAsUpEnabled(true);
You might have 3 folders inside "res" folder
values
values-v11
values-v14
You need to change style.xml file from all this folders to
<style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
in case you have included values-v21 same for that.
now extend your MainActivity with AppCompatActivity(Which you are doing) and assign your ToolBar as ActionBar.
public class MainActivity extends AppCompatActivity {
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
toolbar = (Toolbar) findViewById(R.id.toolbar);
setSupportActionBar(toolbar);
getSupportActionBar().setHomeButtonEnabled(true);
getSupportActionBar().setDisplayHomeAsUpEnabled(true);
}
}
I hope this will help you. if not tell me what error getting after doing that.
Update :
Add this another style to your styles.xml
<style name="NoActionBarStyle" parent="Theme.AppCompat.Light.NoActionBar">
<item name="colorPrimary">#color/colorPrimary</item>
<item name="colorPrimaryDark">#color/colorPrimaryDark</item>
<item name="colorAccent">#color/colorAccent</item>
<item name="windowActionBar">false</item>
</style>
and in manifest.xml file.
<activity
android:name=".CMainActivity"
android:screenOrientation="portrait"
android:theme="#style/NoActionBarStyle" />
Happy Coding.
I'm trying to make Toolbar with EditText within it like this:
Right now I can do some thing similar but only with static title, Any ideas to get started?
I have done this like below:
There is Toolbar as AppBar (aka ActionBar) at the top and second toolbar below it with two EditText. First Toolbar is under CollapsingToolbarLayout in case you want it to be collapsed.
Java:
public class MainActivity extends AppCompatActivity {
Toolbar toolbar;
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
toolbar = (Toolbar) findViewById(R.id.toolbar_1);
setSupportActionBar(toolbar);
getSupportActionBar().setDisplayHomeAsUpEnabled(true);
getSupportActionBar().setTitle("");
}
#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;
}
}
activity_main.xml:
<android.support.design.widget.CoordinatorLayout
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="wrap_content"
android:fitsSystemWindows="true">
<android.support.design.widget.AppBarLayout
android:id="#+id/appbar"
android:layout_width="match_parent"
android:layout_height="wrap_content" >
<android.support.design.widget.CollapsingToolbarLayout
android:id="#+id/collapsing_tool_bar_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:elevation="0dp"
app:expandedTitleTextAppearance="#style/Widget.AppCompat.ActionBar.TabText"
app:layout_scrollFlags="scroll|enterAlways"
app:statusBarScrim="?attr/colorAccent">
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar_1"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="#color/primary"
android:minHeight="?attr/actionBarSize"
android:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar"
app:layout_collapseMode="none"
app:layout_scrollFlags="scroll|exitUntilCollapsed"
app:popupTheme="#style/ThemeOverlay.AppCompat.Light">
</android.support.v7.widget.Toolbar>
</android.support.design.widget.CollapsingToolbarLayout>
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar_2"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/primary"
android:minHeight="?attr/actionBarSize"
android:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar"
app:layout_collapseMode="none"
app:elevation="0dp"
app:layout_scrollFlags="scroll|exitUntilCollapsed"
app:popupTheme="#style/ThemeOverlay.AppCompat.Light">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:paddingLeft="32dp"
android:paddingTop="16dp"
android:paddingBottom="56dp"
android:paddingRight="16dp">
<android.support.design.widget.TextInputLayout
android:id="#+id/lNameLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/fNameLayout"
android:layout_marginTop="10dp">
<EditText
android:id="#+id/ltitle"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:ems="10"
android:hint="Title"/>
</android.support.design.widget.TextInputLayout>
<android.support.design.widget.TextInputLayout
android:id="#+id/lNameLayout2"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/fNameLayout"
android:layout_marginTop="10dp"
android:layout_marginBottom="10dp">
<EditText
android:id="#+id/ldesc"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:ems="10"
android:hint="Description"/>
</android.support.design.widget.TextInputLayout>
</LinearLayout>
</android.support.v7.widget.Toolbar>
</android.support.design.widget.AppBarLayout>
</android.support.design.widget.CoordinatorLayout>
Colors:
<?xml version="1.0" encoding="utf-8"?>
<resources>
<color name="primary">#303F9F</color>
<color name="primary_dark">#3F51B5</color>
<color name="accent">#00E5FF</color>
</resources>
And styles.xml:
<resources>
<style name="AppTheme" parent="AppTheme.Base"/>
<style name="AppTheme.Base" parent="Theme.AppCompat.Light.NoActionBar">
<item name="colorPrimary">#color/primary</item>
<item name="colorPrimaryDark">#color/primary_dark</item>
<item name="colorAccent">#color/accent</item>
<item name="colorControlNormal">#FFF</item>
</style>
</resources>
Use android:theme="#style/AppTheme" for application in manifest and android:theme="#style/AppTheme.Base" forMainActivity`.
I think that you need to create you own toolbarlyout and set it to the activity toolbar.
try this :
http://javatechig.com/android/actionbar-with-custom-view-example-in-android
you just need to create your component.
i hope that will be helpful for you ;)
You can use a linear layout with the same color of your toolbar. The toolbar attribute android:elevation needs to be 0px.
Activity (xml)
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent">
<include
layout="#layout/toolbar_task"
android:layout_width="match_parent"
android:layout_height="wrap_content"
></include>
<fragment xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools" android:id="#+id/fragment_task"
android:name="com.hashicode.simpletodo.fragment.TaskFragment" tools:layout="#layout/fragment_task"
android:layout_width="match_parent" android:layout_height="match_parent" />
</LinearLayout>
Toolbar (xml)
<?xml version="1.0" encoding="utf-8"?>
<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/toolbar"
android:layout_height="wrap_content"
android:layout_width="match_parent"
android:fitsSystemWindows="true"
android:minHeight="?attr/actionBarSize"
app:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar"
android:background="?attr/colorPrimaryDark"
android:elevation="0px">
</android.support.v7.widget.Toolbar>
Fragment (xml)
<?xml version="1.0" encoding="utf-8"?>
<android.support.design.widget.CoordinatorLayout 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="vertical">
<LinearLayout
android:id="#+id/taskname_area"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/PrimaryDarkColor"
android:orientation="vertical">
<android.support.design.widget.TextInputLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:paddingBottom="36dp"
android:paddingLeft="72dp"
android:paddingRight="16dp">
<EditText
android:id="#+id/task_name"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:hint="#string/task.name"
android:textSize="30dp"/>
</android.support.design.widget.TextInputLayout>
</LinearLayout>
<!-- some code -->
</android.support.design.widget.CoordinatorLayout>
Activity (java)
public class TaskActivity extends AppCompatActivity {
#Override
protected void onCreate(#Nullable Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
initializeTodo(savedInstanceState);
setContentView(R.layout.activity_task);
//set the toolbar
setSupportActionBar((Toolbar) findViewById(R.id.toolbar));
getSupportActionBar().setDisplayHomeAsUpEnabled(true);
getSupportActionBar().setTitle(null);
}
The result:
AppBarLayout would be best bet
Ref https://developer.android.com/reference/android/support/design/widget/AppBarLayout.html
Example
http://www.feelzdroid.com/2015/07/android-appbarlayout-scrolling-example.html
obviously you would need to do customizations
Hope this helps