mirror of
https://github.com/commons-app/apps-android-commons.git
synced 2025-10-26 20:33:53 +01:00
Add list item animations and layout
This commit is contained in:
parent
cfae4feb4a
commit
a9a03e2036
5 changed files with 198 additions and 13 deletions
|
|
@ -104,8 +104,8 @@ public class NearbyMapFragment extends android.support.v4.app.Fragment {
|
|||
super.onViewCreated(view, savedInstanceState);
|
||||
this.getView().setFocusableInTouchMode(true);
|
||||
this.getView().requestFocus();
|
||||
this.getView().setOnKeyListener( new View.OnKeyListener()
|
||||
{
|
||||
this.getView().setOnKeyListener( new View.OnKeyListener() {
|
||||
|
||||
@Override
|
||||
public boolean onKey( View v, int keyCode, KeyEvent event) {
|
||||
if (keyCode == KeyEvent.KEYCODE_BACK) {
|
||||
|
|
|
|||
|
|
@ -1,27 +1,40 @@
|
|||
package fr.free.nrw.commons.nearby;
|
||||
|
||||
import android.os.CountDownTimer;
|
||||
import android.support.annotation.NonNull;
|
||||
import android.view.LayoutInflater;
|
||||
import android.view.View;
|
||||
import android.view.ViewGroup;
|
||||
import android.view.animation.Animation;
|
||||
import android.view.animation.AnimationUtils;
|
||||
import android.widget.ImageView;
|
||||
import android.widget.LinearLayout;
|
||||
import android.widget.TextView;
|
||||
|
||||
import com.pedrogomez.renderers.Renderer;
|
||||
|
||||
import java.util.ArrayList;
|
||||
|
||||
import butterknife.BindView;
|
||||
import butterknife.ButterKnife;
|
||||
import fr.free.nrw.commons.R;
|
||||
|
||||
class PlaceRenderer extends Renderer<Place> {
|
||||
|
||||
@BindView(R.id.tvName) TextView tvName;
|
||||
@BindView(R.id.tvDesc) TextView tvDesc;
|
||||
@BindView(R.id.distance) TextView distance;
|
||||
@BindView(R.id.icon) ImageView icon;
|
||||
private final PlaceClickedListener listener;
|
||||
@BindView(R.id.buttonLayout)
|
||||
LinearLayout buttonLayout;
|
||||
private Animation animationUp;
|
||||
private Animation animationDown;
|
||||
private final int COUNTDOWN_RUNNING_TIME = 300;
|
||||
private static ArrayList<LinearLayout> openedItems;
|
||||
|
||||
PlaceRenderer(@NonNull PlaceClickedListener listener) {
|
||||
this.listener = listener;
|
||||
|
||||
PlaceRenderer(){
|
||||
openedItems = new ArrayList<>();
|
||||
}
|
||||
|
||||
@Override
|
||||
|
|
@ -32,11 +45,57 @@ class PlaceRenderer extends Renderer<Place> {
|
|||
@Override
|
||||
protected void setUpView(View view) {
|
||||
ButterKnife.bind(this, view);
|
||||
animationUp = AnimationUtils.loadAnimation(getContext(),R.anim.slide_up);
|
||||
animationDown = AnimationUtils.loadAnimation(getContext(),R.anim.slide_down);
|
||||
}
|
||||
|
||||
@Override
|
||||
protected void hookListeners(View view) {
|
||||
view.setOnClickListener(v -> listener.placeClicked(getContent()));
|
||||
final View.OnClickListener listener = new View.OnClickListener() {
|
||||
@Override
|
||||
public void onClick(View view) {
|
||||
if(buttonLayout.isShown()){
|
||||
closeLayout(buttonLayout);
|
||||
}else {
|
||||
openLayout(buttonLayout);
|
||||
}
|
||||
|
||||
}
|
||||
};
|
||||
view.setOnClickListener(listener);
|
||||
view.requestFocus();
|
||||
view.setOnFocusChangeListener(new View.OnFocusChangeListener() {
|
||||
@Override
|
||||
public void onFocusChange(View view, boolean hasFocus) {
|
||||
if(!hasFocus && buttonLayout.isShown()){
|
||||
closeLayout(buttonLayout);
|
||||
}else if(hasFocus && !buttonLayout.isShown()) {
|
||||
listener.onClick(view);
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
private void closeLayout(LinearLayout buttonLayout) {
|
||||
|
||||
buttonLayout.startAnimation(animationUp);
|
||||
CountDownTimer countDownTimerStatic = new CountDownTimer(COUNTDOWN_RUNNING_TIME
|
||||
, 16) {
|
||||
@Override
|
||||
public void onTick(long millisUntilFinished) {
|
||||
}
|
||||
|
||||
@Override
|
||||
public void onFinish() {
|
||||
buttonLayout.setVisibility(View.GONE);
|
||||
}
|
||||
};
|
||||
countDownTimerStatic.start();
|
||||
}
|
||||
|
||||
private void openLayout(LinearLayout buttonLayout){
|
||||
buttonLayout.setVisibility(View.VISIBLE);
|
||||
buttonLayout.startAnimation(animationDown);
|
||||
}
|
||||
|
||||
@Override
|
||||
|
|
@ -51,8 +110,4 @@ class PlaceRenderer extends Renderer<Place> {
|
|||
distance.setText(place.distance);
|
||||
icon.setImageResource(place.getLabel().getIcon());
|
||||
}
|
||||
|
||||
interface PlaceClickedListener {
|
||||
void placeClicked(Place place);
|
||||
}
|
||||
}
|
||||
|
|
|
|||
13
app/src/main/res/anim/slide_down.xml
Normal file
13
app/src/main/res/anim/slide_down.xml
Normal file
|
|
@ -0,0 +1,13 @@
|
|||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<set xmlns:android="http://schemas.android.com/apk/res/android"
|
||||
android:fillAfter="true">
|
||||
|
||||
<scale
|
||||
android:duration="300"
|
||||
android:fromXScale="1.0"
|
||||
android:fromYScale="0.0"
|
||||
android:interpolator="@android:anim/linear_interpolator"
|
||||
android:toXScale="1.0"
|
||||
android:toYScale="1.0" />
|
||||
|
||||
</set>
|
||||
13
app/src/main/res/anim/slide_up.xml
Normal file
13
app/src/main/res/anim/slide_up.xml
Normal file
|
|
@ -0,0 +1,13 @@
|
|||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<set xmlns:android="http://schemas.android.com/apk/res/android"
|
||||
android:fillAfter="true" >
|
||||
|
||||
<scale
|
||||
android:duration="300"
|
||||
android:fromXScale="1.0"
|
||||
android:fromYScale="1.0"
|
||||
android:interpolator="@android:anim/linear_interpolator"
|
||||
android:toXScale="1.0"
|
||||
android:toYScale="0.0" />
|
||||
|
||||
</set>
|
||||
|
|
@ -2,9 +2,10 @@
|
|||
xmlns:tools="http://schemas.android.com/tools"
|
||||
android:layout_width="match_parent"
|
||||
android:layout_height="wrap_content"
|
||||
xmlns:app="http://schemas.android.com/apk/res-auto"
|
||||
android:foreground="?selectableItemBackground"
|
||||
android:minHeight="72dp"
|
||||
>
|
||||
android:focusableInTouchMode="true"
|
||||
android:minHeight="72dp">
|
||||
|
||||
<ImageView
|
||||
android:id="@+id/icon"
|
||||
|
|
@ -32,6 +33,17 @@
|
|||
tools:text="@string/placeholder_place_distance"
|
||||
/>
|
||||
|
||||
<ImageView
|
||||
android:id="@+id/toggleArrow"
|
||||
android:layout_width="wrap_content"
|
||||
android:layout_height="wrap_content"
|
||||
android:layout_alignParentEnd="true"
|
||||
android:layout_alignParentRight="true"
|
||||
android:layout_marginRight="16dp"
|
||||
android:layout_marginTop="32dp"
|
||||
app:srcCompat="@drawable/ic_keyboard_arrow_right_black_24dp"
|
||||
/>
|
||||
|
||||
<TextView
|
||||
android:id="@+id/tvName"
|
||||
android:layout_width="match_parent"
|
||||
|
|
@ -65,4 +77,96 @@
|
|||
tools:text="@string/placeholder_place_description"
|
||||
/>
|
||||
|
||||
</RelativeLayout>
|
||||
<LinearLayout
|
||||
android:layout_width="match_parent"
|
||||
android:layout_height="wrap_content"
|
||||
android:id="@+id/buttonLayout"
|
||||
android:orientation="horizontal"
|
||||
android:visibility="visible"
|
||||
android:layout_below="@+id/icon"
|
||||
>
|
||||
|
||||
<TextView
|
||||
android:id="@+id/description"
|
||||
android:layout_width="match_parent"
|
||||
android:layout_height="wrap_content"
|
||||
android:layout_marginLeft="72dp"
|
||||
android:layout_marginRight="16dp"
|
||||
android:layout_marginBottom="16dp"
|
||||
android:textSize="16sp"
|
||||
android:text="Description Description Description
|
||||
Description Description Description
|
||||
Description Description Description
|
||||
" />
|
||||
|
||||
<LinearLayout
|
||||
android:id="@+id/directionsButton"
|
||||
android:layout_width="0dp"
|
||||
android:layout_height="wrap_content"
|
||||
android:layout_weight="1"
|
||||
android:padding="16dp"
|
||||
android:clickable="true"
|
||||
android:orientation="vertical"
|
||||
>
|
||||
<ImageView
|
||||
android:layout_width="wrap_content"
|
||||
android:layout_height="wrap_content"
|
||||
android:layout_gravity="center_horizontal"
|
||||
app:srcCompat="@drawable/ic_directions_black_48dp" />
|
||||
<TextView
|
||||
android:layout_width="wrap_content"
|
||||
android:layout_height="wrap_content"
|
||||
android:paddingTop="8dp"
|
||||
android:layout_gravity="center_horizontal"
|
||||
android:text="DIRECTIONS"
|
||||
/>
|
||||
</LinearLayout>
|
||||
<LinearLayout
|
||||
android:id="@+id/wikidataButton"
|
||||
android:layout_width="0dp"
|
||||
android:layout_height="wrap_content"
|
||||
android:layout_weight="1"
|
||||
android:padding="16dp"
|
||||
android:clickable="true"
|
||||
android:orientation="vertical"
|
||||
>
|
||||
<ImageView
|
||||
android:layout_width="wrap_content"
|
||||
android:layout_height="wrap_content"
|
||||
android:layout_gravity="center_horizontal"
|
||||
app:srcCompat="@drawable/ic_wikidata_logo_48dp" />
|
||||
<TextView
|
||||
android:layout_width="wrap_content"
|
||||
android:layout_height="wrap_content"
|
||||
android:paddingTop="8dp"
|
||||
android:layout_gravity="center_horizontal"
|
||||
android:text="WIKI DATA"
|
||||
/>
|
||||
</LinearLayout>
|
||||
|
||||
<LinearLayout
|
||||
android:id="@+id/wikipediaButton"
|
||||
android:layout_width="0dp"
|
||||
android:layout_height="wrap_content"
|
||||
android:layout_weight="1"
|
||||
android:padding="16dp"
|
||||
android:clickable="true"
|
||||
android:orientation="vertical"
|
||||
>
|
||||
<ImageView
|
||||
android:layout_width="wrap_content"
|
||||
android:layout_height="wrap_content"
|
||||
android:layout_gravity="center_horizontal"
|
||||
app:srcCompat="@drawable/ic_wikipedia_logo_48dp"
|
||||
/>
|
||||
<TextView
|
||||
android:layout_width="wrap_content"
|
||||
android:layout_height="wrap_content"
|
||||
android:paddingTop="8dp"
|
||||
android:layout_gravity="center_horizontal"
|
||||
android:text="WIKIPEDIA"
|
||||
|
||||
/>
|
||||
</LinearLayout>
|
||||
</LinearLayout>
|
||||
</RelativeLayout>
|
||||
Loading…
Add table
Add a link
Reference in a new issue