akk akk - 9 days ago 6
Android Question

Background view needs to be small when I drag top view in android

I used android BottomSheet to replicate this.

Background view needs to be small when I drag top view.
I tried following code. any library available to replicate this.
I integrated bottomsheet android library

View overlay stack animation

public class MainActivity extends AppCompatActivity implements CollapsibleCalendarView.Listener<Event> {

@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
mCalendarView = (CollapsibleCalendarView) findViewById(R.id.calendar);
mListView = (ListView) findViewById(R.id.calendar_event_list);
mCalendarView.setListener(this);
mCalendarView.addEvents(getEvents());

bottomSheet = findViewById(R.id.design_bottom_sheet);
behavior = BottomSheetBehavior.from(bottomSheet);

behavior.setBottomSheetCallback(new BottomSheetBehavior.BottomSheetCallback() {
@Override
public void onStateChanged(@NonNull View bottomSheet, int newState) {
switch (newState) {
case BottomSheetBehavior.STATE_DRAGGING:
Log.i("BottomSheetCallback", "BottomSheetBehavior.STATE_DRAGGING");
break;
case BottomSheetBehavior.STATE_SETTLING:

break;
case BottomSheetBehavior.STATE_EXPANDED:
mCalendarView.toggle();

break;
case BottomSheetBehavior.STATE_COLLAPSED:
mCalendarView.toggle();

break;
case BottomSheetBehavior.STATE_HIDDEN:

break;
}
}

@Override
public void onSlide(@NonNull View bottomSheet, float slideOffset) {
}
});

Button button = (Button) findViewById(R.id.button);
button.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View view) {
if (behavior.getState() == BottomSheetBehavior.STATE_COLLAPSED) {
behavior.setState(BottomSheetBehavior.STATE_EXPANDED);
} else {
behavior.setState(BottomSheetBehavior.STATE_COLLAPSED);
}
}
});
}
}

Answer

When you slide the bottomSheet, scale the top view using view scaling.

@Override
public void onSlide(@NonNull View bottomSheet, float slideOffset) {     
            // Add scaling code as per your requirements.    
    float scalingFactor = 0.5f; //       scale down to half the size     
    view.setScaleX(scalingFactor);       
    view.setScaleY(scalingFactor);        
} 

You need API 11 or above to scale a view.