I have a navigation drawer in my App. When I open the drawer I want it to open below the content, I changed some attributes to get the image what I have. but what I want is show in image What I want to reach, and you can find my code here:
Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);
setSupportActionBar(toolbar);
final DrawerLayout drawerLayout = (DrawerLayout) findViewById(R.id.drawer_layout);
final CoordinatorLayout content = (CoordinatorLayout) findViewById(R.id.content);
drawerLayout.setScrimColor(Color.TRANSPARENT);
ActionBarDrawerToggle actionBarDrawerToggle = new ActionBarDrawerToggle(this, drawerLayout, toolbar,R.string.navigation_drawer_open, R.string.navigation_drawer_close) {
private float scaleFactor = 6f;// private float scaleFactor = 6f;
#Override
public void onDrawerSlide(View drawerView, float slideOffset) {
super.onDrawerSlide(drawerView, slideOffset);
float slideX = drawerView.getWidth() * slideOffset;
content.setTranslationX(slideX);
content.setScaleX(1 );
content.setScaleY(1 - (slideOffset / scaleFactor));
}
};
drawerLayout.setScrimColor(Color.TRANSPARENT);
drawerLayout.setDrawerElevation(0f);
drawerLayout.addDrawerListener(actionBarDrawerToggle);
Related
To change toolbar background color as appBarLayout is being collapsed
I've used below code
AppBarLayout appBarLayout = findViewById(R.id.app_bar);
appBarLayout.addOnOffsetChangedListener(new AppBarLayout.OnOffsetChangedListener() {
#Override
public void onOffsetChanged(AppBarLayout appBarLayout, int verticalOffset) {
float offset = (float) Math.abs(verticalOffset) / appBarLayout.getTotalScrollRange();
toolbar.getBackground().setAlpha((int) (offset * 255));
}
});
Now I would like to change the color of menu items that is on the toolbar when the appBarLayout is being collapsed like below sample
Expected Result
Menu mItem;
#Override
public boolean onCreateOptionsMenu(Menu menu) {
mItem = menu;
getMenuInflater().inflate(R.menu.bookmark_menu, menu);
return super.onCreateOptionsMenu(menu);
}
Get the reference of menu.In your offsetchangelistener
appBarLayout.addOnOffsetChangedListener(new AppBarLayout.OnOffsetChangedListener()
{
#Override
public void onOffsetChanged (AppBarLayout appBarLayout,int verticalOffset){
float offset = (float) Math.abs(verticalOffset) / appBarLayout.getTotalScrollRange();
toolbar.getBackground().setAlpha((int) (offset * 255));
mItem.findViewById(R.id.example).getIcon().setColorFilter(ContextCompat.getColor(ActivityHome.this, R.color.yourcolor), PorterDuff.Mode.SRC_IN);
}
});
Anyone having idea that how to achieve this type of transition. When we open Navagation drawer full screen is getting animation like this. I also looked at reside menu but here menu is predefined not as i want.
I also tried with NavigationDrawer but not got succeed.
drawer.addDrawerListener(new DrawerLayout.DrawerListener() {
#Override
public void onDrawerSlide(View drawerView, float slideOffset) {
float moveFactor = (linearLayout.getWidth() * slideOffset);
float min = 0.9f;
float max = 1.0f;
float scaleFactor = (max - ((max - min) * slideOffset));
if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.HONEYCOMB)
{
linearLayout.setTranslationX(moveFactor);
linearLayout.setScaleX(scaleFactor);
linearLayout.setScaleY(scaleFactor);
}
else
{
AnimationSet animSet = new AnimationSet(true);
TranslateAnimation anim = new TranslateAnimation(lastTranslate, moveFactor, 0.0f, 0.0f);
anim.setDuration(0);
anim.setFillAfter(true);
animSet.addAnimation(anim);
ScaleAnimation scale = new ScaleAnimation(1.15f, 1.0f, 1.15f, 1.0f);
scale.setDuration(10);
scale.setFillAfter(true);
animSet.addAnimation(scale);
drawerView.startAnimation(animSet);
lastTranslate = moveFactor;
}
}
#Override
public void onDrawerOpened(View drawerView) {
}
#Override
public void onDrawerClosed(View drawerView) {
}
#Override
public void onDrawerStateChanged(int newState) {
}
});
Thanks in advance
Finally I got my answer through this link for original post. Please have a look here
<?xml version="1.0" encoding="utf-8"?>
<android.support.v4.widget.DrawerLayout 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:id="#+id/drawer_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
tools:context="test.pyramidions.com.dynamicview2.MainActivity"
tools:openDrawer="start">
<RelativeLayout
android:id="#+id/holder"
android:layout_width="match_parent"
android:background="#drawable/shadow"
android:layout_height="match_parent"
android:orientation="vertical">
<LinearLayout
android:id="#+id/content"
android:layout_width="match_parent"
android:background="#color/colorAccent"
android:layout_height="match_parent"
android:orientation="vertical">
<include
android:id="#+id/toolbar"
layout="#layout/toolbar" />
<android.support.v4.view.ViewPager
android:id="#+id/pager"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1" />
</LinearLayout>
</RelativeLayout>
<android.support.design.widget.NavigationView
android:id="#+id/nav_view"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:background="#android:color/transparent"
android:layout_gravity="start"
app:headerLayout="#layout/nav_header_main"
app:menu="#menu/drawer_menu" />
</android.support.v4.widget.DrawerLayout>
and for MainActivity.java please have a look below
public class MainActivity extends AppCompatActivity {
public TabsPagerAdapter tabsPagerAdapter;
public static ViewPager pager;
int Numboftabs = 2;
Toolbar toolbar;
public NavigationView navigationView;
public DrawerLayout drawer;
View holderView, contentView;
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
toolbar = (Toolbar) findViewById(R.id.toolbar);
drawer = (DrawerLayout) findViewById(R.id.drawer_layout);
navigationView = (NavigationView) findViewById(R.id.nav_view);
holderView = findViewById(R.id.holder);
contentView = findViewById(R.id.content);
tabsPagerAdapter = new TabsPagerAdapter(getSupportFragmentManager(), Numboftabs);
pager = (ViewPager) findViewById(R.id.pager);
pager.setAdapter(tabsPagerAdapter);
toolbar.setNavigationIcon(new DrawerArrowDrawable(this));
toolbar.setNavigationOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View v) {
if (drawer.isDrawerOpen(navigationView)) {
drawer.closeDrawer(navigationView);
} else {
drawer.openDrawer(navigationView);
}
}
}
);
drawer.setScrimColor(Color.TRANSPARENT);
drawer.addDrawerListener(new DrawerLayout.SimpleDrawerListener() {
#Override
public void onDrawerSlide(View drawer, float slideOffset) {
contentView.setX(navigationView.getWidth() * slideOffset);
RelativeLayout.LayoutParams lp =
(RelativeLayout.LayoutParams) contentView.getLayoutParams();
lp.height = drawer.getHeight() -
(int) (drawer.getHeight() * slideOffset * 0.3f);
lp.topMargin = (drawer.getHeight() - lp.height) / 2;
contentView.setLayoutParams(lp);
}
#Override
public void onDrawerClosed(View drawerView) {
}
}
);
}
Drawer behavior is a library use Android DrawerLayout Support library as Parent Class [Easy to migrate], that provide an extra behavior on drawer, such as, move view or scaling view's height while drawer on slide.
If current project use Android DrawerLayout Support library and kinda boring with the effect. Then, just change the layout code and calling necessary method for animation/effect.
Check out github code
Gradle
dependencies {
implementation 'com.infideap.drawerbehavior:drawer-behavior:0.1.5'
}
if the gradle unable to sync, you may include this line in project level gradle,
repositories {
maven{
url "https://dl.bintray.com/infideap2/Drawer-Behavior"
}
}
I am using the support.v7 Cardview and when i click on them i made a animation so the cardview expands to show more Information.
This worked fine and smooth, but now i add a toolbar as Support actionbar and now the Animation is laggy and i have no idea why:
I use this to expand a cardview
public void expand(final View v,final View vi) {
v.measure(LayoutParams.MATCH_PARENT,
WindowManager.LayoutParams.WRAP_CONTENT);
final int targetHeight = getHeight((ListView)v);
v.getLayoutParams().height = 0;
v.setVisibility(View.VISIBLE);
Animation a = new Animation()
{
#Override
protected void applyTransformation(float interpolatedTime, Transformation t) {
vi.setAlpha(1-interpolatedTime*10);
v.setAlpha(1-vi.getAlpha());
double heigt = -(targetHeight / (interpolatedTime + 1)) + targetHeight;
v.getLayoutParams().height =new Double(heigt*2).intValue();
v.requestLayout();
}
#Override
public boolean willChangeBounds() {
return true;
}
};
// 1dp/ms
a.setDuration(750);
v.startAnimation(a);
Handler h = new Handler();
h.postDelayed(new Runnable() {
#Override
public void run() {
v.getLayoutParams().height=targetHeight;
v.requestLayout();
vi.setVisibility(View.GONE);
}
},a.getDuration()+100);
}
and this is how i create the toolbar:
toolbar = (Toolbar) findViewById(R.id.toolbar);
setSupportActionBar(toolbar);
toolbar.setTitle("CocktailListe");
toolbar.setSubtitle("Deine Lieblingscocktails in einer app");
toolbar.setTitleTextColor(getResources().getColor(R.color.text_main));
toolbar.setSubtitleTextColor(getResources().getColor(R.color.text_actionbar_secondary));
toolbar.setBackgroundColor(Color.parseColor(db.getActionbarColor()));
I´m pretty stuck and have no idea why it lags while using the toolbar, i hope someone can help
I'm trying to make Navigation Drawer which moves whole screen (whole height, not width). I'm not using ActionBar and other libraries, just default Android drawer. Anyone have any examples?
What you need to do is to set the translationX property of your content view by the pixel amount the drawer has moved to.
In your implementation of http://developer.android.com/reference/android/support/v4/widget/DrawerLayout.DrawerListener.html you should implement onDrawerSlide(View drawerView, float slideOffset).
In this method you should add this line.
mDrawerLayout.findViewById(R.id.your_content_id).setTranslationX(drawerView.getWidth() * slideOffset);
That should do the trick.
Implements DrawerListener (passing as parameter the R.id of your layout):
import android.animation.ObjectAnimator;
import android.support.v4.widget.DrawerLayout.DrawerListener;
import android.view.View;
public class DrawerLayoutListener implements DrawerListener {
private View _contentDrawer;
private int _idView;
public DrawerLayoutListener(int idView) {
_idView = idView;
}
#Override
public void onDrawerClosed(View arg0) {}
#Override
public void onDrawerOpened(View arg0) {}
#Override
public void onDrawerSlide(View drawerView, float slideOffset) {
if (_contentDrawer == null) _contentDrawer = ((View) drawerView.getParent()).findViewById(_idView);
float moveFactor = (drawerView.getWidth() * slideOffset);
ObjectAnimator.ofFloat(_contentDrawer, "translationX", moveFactor).setDuration(0).start();
}
#Override
public void onDrawerStateChanged(int arg0) {}
}
And set it as listener to your DrawerLayout:
drawer_layout.setDrawerListener(new DrawerLayoutListener(R.id.content_frame));
I have a SurfaceView that should be set with setZOrderOnTop(true) , is it possible to have a DrawerLayout that opens over it. currently the surface draws over the drawer.
In a similar situation the solution from DrawerLayout not working with Android 4.4 & SurfaceView worked for me:
#Override
public void onDrawerSlide(View drawerView, float slideOffset)
{
mDrawerLayout.bringChildToFront(drawerView);
mDrawerLayout.requestLayout();
}
Inside of your DrawerListener
The below code worked for me.
actionBarDrawerToggle = new ActionBarDrawerToggle(this,drawerLayout,R.string.open, R.string.close)
{
#Override
public void onDrawerSlide(View drawerView, float slideOffset) {
super.onDrawerSlide(drawerView, slideOffset);
drawerLayout.bringChildToFront(drawerView);
drawerLayout.requestLayout();
}
};