Unable to put Back arrow button, Output is weird

[Mayur-007]

trafficstars

Hello,

I have tried all possible ways to put Back Arrow but it don't work. I have seen everywhere that Toolbar should be inside CollapsingToolbarLayout but in your code it's not.

other issue is i have to drag and scroll to make animation work, it won't work if i just touch and slide it.. i continuously have to touch the screen to make it work, that is bad for User Experience. If you can provide solution for this, i would love to include it in my app..

Awesome work by the way.. Thanks :)

[iabdullo]

the solution is change in AvatarImageBehavior class this line child.setX(mStartXPosition - distanceXToSubtract); to this one child.setX(mStartXPosition - distanceXToSubtract + 90);

and in Activity add back button

Drawable upArrow = getResources().getDrawable(R.drawable.abc_ic_ab_back_material);
mToolbar.setNavigationIcon(upArrow);
mToolbar.setNavigationOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                onBackPressed();
            }
        });

[uditunpluged]

I followed @iabdullo 's answer but getting a janky UI, so I modified the AvatarImageBehaviour.class a bit to achieve the desired result. Thanks for the clue @iabdullo.

@Override
  public boolean onDependentViewChanged(CoordinatorLayout parent, CircleImageView child, View dependency) {
      maybeInitProperties(child, dependency);

      final int maxScrollDistance = (int) (mStartToolbarPosition);
      float expandedPercentageFactor = dependency.getY() / maxScrollDistance;

      if (expandedPercentageFactor < mChangeBehaviorPoint) {
          float heightFactor = (mChangeBehaviorPoint - expandedPercentageFactor) / mChangeBehaviorPoint;

          float distanceXToSubtract = ((mStartXPosition - mFinalXPosition)
                  * heightFactor) + (child.getHeight() / 2);
          float distanceYToSubtract = ((mStartYPosition - mFinalYPosition)
                  * (1f - expandedPercentageFactor)) + (child.getHeight() / 2);

          child.setX(mStartXPosition - distanceXToSubtract + 90);
          child.setY(mStartYPosition - distanceYToSubtract);

          float heightToSubtract = ((mStartHeight - mCustomFinalHeight) * heightFactor);

          CoordinatorLayout.LayoutParams lp = (CoordinatorLayout.LayoutParams) child.getLayoutParams();
          lp.width = (int) (mStartHeight - heightToSubtract);
          lp.height = (int) (mStartHeight - heightToSubtract);
          child.setLayoutParams(lp);
      } else {
          float distanceYToSubtract = ((mStartYPosition - mFinalYPosition)
                  * (1f - expandedPercentageFactor)) + (mStartHeight / 2);

          child.setX(mStartXPosition + 90 - child.getWidth() / 2);
          child.setY(mStartYPosition - distanceYToSubtract);


          CoordinatorLayout.LayoutParams lp = (CoordinatorLayout.LayoutParams) child.getLayoutParams();
          lp.width = (int) (mStartHeight);
          lp.height = (int) (mStartHeight);
          child.setLayoutParams(lp);
      }
      return true;
  }

and also

private void maybeInitProperties(CircleImageView child, View dependency) {
       if (mStartYPosition == 0)
           mStartYPosition = (int) (dependency.getY());

       if (mFinalYPosition == 0)
           mFinalYPosition = (dependency.getHeight() / 2);

       if (mStartHeight == 0)
           mStartHeight = child.getHeight();

       if (mStartXPosition == 0)
           mStartXPosition = (int) (child.getX() - 90 + (child.getWidth() / 2));

       if (mFinalXPosition == 0)
           mFinalXPosition = mContext.getResources().getDimensionPixelOffset(R.dimen.abc_action_bar_content_inset_material) + ((int) mCustomFinalHeight / 2);

       if (mStartToolbarPosition == 0)
           mStartToolbarPosition = dependency.getY();

       if (mChangeBehaviorPoint == 0) {
           mChangeBehaviorPoint = (child.getHeight() - mCustomFinalHeight) / (2f * (mStartYPosition - mFinalYPosition));
       }
   }

Hope! it works. :D 👍

[drinfernoo]

@uditunpluged Could you possibly explain the changes you made?

[fakebecak]

the avatar position when collapsed