Add list item animations and layout

This commit is contained in:
neslihanturan 2017-12-11 16:40:27 +03:00 committed by maskara
parent cfae4feb4a
commit a9a03e2036
5 changed files with 198 additions and 13 deletions

View file

@ -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) {

View file

@ -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);
}
}

View 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>

View 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>

View file

@ -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>