[Android_카카오페이클론코딩] 레이아웃 클릭시 border 이동 (layout click border transition other layout)
2021. 8. 23. 17:08ㆍ카테고리 없음
[Android] 레이아웃 클릭시 border 이동 (layout click border transition other layout)
애니메이션 공부도 할겸 관련글들을 많이 찾아보았다
View 그리기 부터 시작해서 애니메이션(ValueAnimator) , 트랜지션(Transition), Tab 레이아웃을 클릭할 때 각 탭들 아래에 있는 인디케이터 이동방식처럼 구현해보려고 Tablayout 클래스 를 분석하기도 했는데 내가 원하는 방식처럼 동작하기는 쉽지 않았다 ㅠㅠ
그래서 고안한 방법이 FrameLayout 과 내부 레이아웃의 조합으로 클릭시에 각 레이아웃의 y 좌표로 이동시키는 방법이었는데..
혹시 다른방법이 있으시다면 댓글로 알려주시면 감사하겠습니다 ㅠㅠ
자바코드와 레이아웃 첨부합니다!
findViewById(R.id.ll_2).setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
Log.d("jhy","click1");
ObjectAnimator animator = ObjectAnimator.ofFloat(findViewById(R.id.ll_indicator),"translationY",
findViewById(R.id.ll_2).getY());
animator.setDuration(500);
animator.start();
}
});
findViewById(R.id.ll_1).setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
ObjectAnimator animator = ObjectAnimator.ofFloat(findViewById(R.id.ll_indicator),"translationY",
findViewById(R.id.ll_1).getY());
animator.setDuration(500);
animator.start();
}
});
findViewById(R.id.ll_3).setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
ObjectAnimator animator = ObjectAnimator.ofFloat(findViewById(R.id.ll_indicator),"translationY",
findViewById(R.id.ll_3).getY());
animator.setDuration(500);
animator.start();
}
});
<LinearLayout
android:layout_marginTop="50dp"
android:id="@+id/ll_parent"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent">
<FrameLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<LinearLayout
android:background="@color/purple_200"
android:id="@+id/ll_1"
android:layout_width="match_parent"
android:layout_height="50dp"
android:orientation="horizontal"></LinearLayout>
<LinearLayout
android:background="@color/purple_500"
android:id="@+id/ll_2"
android:layout_width="match_parent"
android:layout_height="50dp"
android:layout_marginTop="55dp"
android:orientation="horizontal">
</LinearLayout>
<LinearLayout
android:background="@color/purple_700"
android:id="@+id/ll_3"
android:layout_width="match_parent"
android:layout_height="50dp"
android:layout_marginTop="110dp"
android:orientation="horizontal">
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="50dp"
android:id="@+id/ll_indicator"
android:background="@drawable/border_background">
</LinearLayout>
</FrameLayout>
</LinearLayout>