My question is how do I do make the ActionBar transparent (and also the status bar)?
I'm having trouble trying to make use of the AppBarLayout and Toolbars on Android to achieve that.
I need that because I want to create an application that has one main Activity that holds a DrawerLayout and many screens which are mostly fragments. Then, there is some screens where the ActionBar and StatusBar becomes transparent (while still having the hamburger button for the DrawerLayout).
I've tried changing the AppBarLayout and the Toolbar, but it looks weird... It looks like there are some weird margins on the ActionBar.
appBarLayout.setBackgroundColor(ContextCompat.getColor(this, android.R.color.transparent));
toolbar.setBackgroundColor(ContextCompat.getColor(this, android.R.color.transparent));
And here is the result:
And here is it before changing the color/changing it back:
Any ideas on how to achieve the transparency on the ActionBar when some fragments are attached to the main content of the main Activity?
If you want to take a look at the code, here is the repository: Sample Repo.
Okay...
I made a mistake here...
First, all you need to do is remove the paddings on the content_main.xml and set the elevation of the appBarLayout to 0 and the code will work. (You'd need to set it back to its original value if you need the shadows).
I updated the repo to fix that and it should be working now.
But, There is another way to solve this problem using a fragment with its own AppBarLayout/Toolbar and hiding and showing the MainActivity AppBarLayout when you're showing the Fragment inner one.
I'll create a branch in the same repository to show what I mean.
Please, answer/comment with better solutions/ideas if have them.
Repo here.
Related
I have used Google's solution for multiple back stacks in Navigation Component. I want to setup a custom AppBar at the activity level(Idea is to have a Toolbar, A FragmentContainerView, and BottomNavigationView)
This works fine except this sets the title of the Toolbar automatically (doesn't call any particular method in the file I have linked as far as I know) .
I want to build a custom toolbar which has a TextView with multiple colors(As in half of the title is black , other half is yellow).
Any solution how to build a custom toolbar in this solution would be greatly appreciated
You can read this document about handle navigation component back stack with appBar configuration
https://developer.android.com/guide/navigation/navigation-ui
and also you can watch this course for make custom toolbar
https://m.youtube.com/watch?v=e5_C9e_gKOM
I have 20 fragments in my android application.
There are two fragments which have CollaspingToolbarLayout - i want this fragment's statusbar color as like their CollaspingToolbar color which is primarycolor
Other eighteen fragments have Toolbar - i want this fragment's statusbar color as like their toolbar color which is white
I can do it by adding this in each fragments but I have to add this in all the fragments.
GetActivity().getWindow().setStatusBarColor(//color here//);
Is there any other way to do so?
Thank you in advance.
Your case is very specific.
You can set StatusBar color back to white when closing your fragments which have CollapsingToolbarLayout. In this way, you do not need to touch other 18 fragments. You only touch only those 2 fragments.
Note: I really recommend to have a parent activity or fragment which have dedicated methods for such actions. It makes your code clean and more readable.
I've been interested in material design and wanted to build a layout for the main page of my app so that it looks like the default template for Scrolling Activity but also has a Navigation Drawer like the default template for Navigation Drawer Activity for easy navigation.
As an example, Google's Play Music app already does this sort of thing.
Have a look:
Scrolling list with a banner and a FAB at the top,
Navigation Drawer, accessed by swiping from over to the left
I've searched everywhere and could find a direct way for implementing such a layout. So I tried doing it on my own and with some changes here and there in the default templates of Scrolling Activity and the Navigation Drawer Activity I was able to achieve something along those lines but not exactly what I was looking for.
I was hopping if someone could present a better way of doing it.
You can still use the DrawerLayout supplied in the Android support library with a FrameLayout and ListView to achieve the Navigation drawer. In the FrameLayout, you will display a Fragment which takes a ScrollView to display scrollable content. The Fragment can also have other widgets that let you customize your layout.
I've got exactly what I wanted, you simply need to include Scrolling Activity's layout inside the layout of Navigation Drawer Activity and it works nicely.
You can use the default templates for these activities given in the Android Studio to save yourself some time or start from scratch.
Let me know if anyone needs some code and I will be more than happy to post it :)
I'm working on a project where I need to change the actionbar color within a single activity multiple times according to the content. This is done using
bar.setBackgroundDrawable(colorDrawable);
WITH this line, a portion of the actionbar turns transparent/grey (base theme is #style/Theme.AppCompat.Light.DarkActionBar) as soon as the navigation drawer is opened.
WITHOUT it, the background stays solid as expected even when the navigation drawer is opened. However, this does not allow for diffrent colored pages.
I'm using the support actionbar from appcompat 7, but it can be reproduced with a Toolbar as well as on multiple android versions.
Any ideas WHY this happens? Have I just messed up or is this in fact a bug?
Any workarounds, apart from setting a fixed color for the actionbar?
Note the right area of the actionbar that has become grey/transparent after opening the navigation drawer
I solved it. Kind of...
Please post other solutions if you can improve on this, as it is not the cleanest solution.
Changing the above mentioned
bar.setBackgroundDrawable(colorDrawable);
to
bar.setBackgroundDrawable(new ColorDrawable(((ColorDrawable) colorDrawable).getColor()));
solved the problem for me. This really should not have to be done though.
I've read this question and watch the video clip from Bitspin, however I'm still unable to figure out the techtique they used on ActionBar.
You can observe the ActionBar layout transition inside Timely, when navigating from the settings Fragment to the about Fragment (and navigating back), the up caret and the title is animated by zooming and fading. So how is this made possible?
Or can you let me know if there is some techtique on crossfading ActionBar layout changes? My main purpose is to smooth the transition when user opens the navigational drawer and the title changes, aciton buttons disappears.
Thanks in advance.
EDIT:
I turned on the dev options for showing layout borders and found that Timely is using custom layouts to achieve this. However this is not possible for other applications heavily relying on other ActionBar features such as ActionMenu.
So are there any alternative ways to achieve layout transitions on ActionBar and its ActionMenus?