Я играл с анимацией, слоями и так далее, и я кодировал это простое скользящее меню. Идея очень проста, когда пользователь касается экрана и поднимает палец, приложение показывает меню, когда пользователь касается экрана и опускает палец, это меню исчезает. Как видите, идея очень проста, но может быть полезна, когда мы хотим добавить меню в наши приложения.
Первым шагом является создание нашего скользящего слоя, который будет содержать наше меню. Для простоты я просто покажу TextView, но вы можете изменить код для отображения вашего меню. Предположим, что activity_main.xml — это xml-макет нашей Activity, поэтому мы имеем:
|
01
02
03
04
05
06
07
08
09
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
|
android:layout_width="match_parent" android:layout_height="match_parent" android:background="@color/green"> <LinearLayout android:id="@+id/slider" android:layout_width="match_parent" android:layout_height="60dp" android:layout_alignParentBottom="true" android:layout_alignParentLeft="false" android:layout_alignParentTop="false" android:layout_centerInParent="true" android:background="@color/gray" android:content="@+id/content" android:gravity="bottom|center_horizontal" android:orientation="vertical" > <TextView android:id="@id/content" android:layout_width="match_parent" android:layout_height="wrap_content" android:text="Surviving with android"/> </LinearLayout></RelativeLayout> |
Это базовый слой, который будет перемещаться вверх и вниз, следуя указаниям пальца пользователя. Если вы хотите добавить меню, замените TextView на ваше меню (возможно, с кнопками и т. Д.). Теперь давайте посмотрим на активность, которая должна управлять этим меню. При запуске этот слой должен быть невидимым, поэтому мы должны добавить:
|
1
2
3
4
5
6
7
8
9
|
@Override public void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); ll = (LinearLayout) findViewById(R.id.slider); ll.setVisibility(View.GONE); ....} |
Мы просто устанавливаем видимость макета в View.GONE . Теперь мы должны отслеживать движения пальцев пользователя, чтобы реагировать на эти движения. Для этого нам нужно просто переопределить метод public boolean onTouchEvent (событие MotionEvent). Если мы хотим получить больше информации о том, как обрабатывать события сенсорного экрана, посмотрите здесь . Чтобы узнать, перемещает ли пользователь палец вверх или вниз, нам просто нужно сохранить положение Y, когда пользователь впервые касается экрана (событие MotionEvent.ACTION_DOWN ), и сравнить его значение с положением Y, когда пользователь перемещает палец вверх ( Событие MotionEvent.ACTION_UP ). Итак, мы имеем:
|
01
02
03
04
05
06
07
08
09
10
11
12
13
14
15
16
17
18
19
20
21
22
23
|
@Overridepublic boolean onTouchEvent(MotionEvent event) { switch (event.getAction()) { case MotionEvent.ACTION_DOWN : { startY = event.getY(); break ; } case MotionEvent.ACTION_UP: { float endY = event.getY(); if (endY < startY) { System.out.println("Move UP"); ll.setVisibility(View.VISIBLE); } else { ll.setVisibility(View.GONE); } } } return true;} |
Таким образом, мы создали простое меню ВКЛ / ВЫКЛ, которое отображается, когда пользователь поднимает палец вверх, и становится невидимым, когда пользователь перемещает палец вниз. Мы могли бы добавить некоторый элемент управления, например, порог, который вызывает меню.
Добавить анимацию
Чтобы сделать это меню более привлекательным и сделать слой движущимся вверх или вниз, мы можем добавить анимацию. Для этого под каталогом res добавьте каталог с именем anim (если его нет). Мы хотим создать две анимации, одна из которых показывает, что макет движется вверх, а другая — его перемещение вниз. Мы создаем два файла, один из которых называется anim_up.xml, с таким содержанием:
|
1
2
3
4
5
6
7
|
<?xml version="1.0" encoding="utf-8"?> <translate android:fromYDelta="100%" android:toYDelta="40%" android:duration="400"/></set> |
и еще один, называемый anim_down.xml:
|
1
2
3
4
5
6
7
|
<?xml version="1.0" encoding="utf-8"?> <translate android:fromYDelta="0%" android:toYDelta="100%" android:duration="400"/></set> |
Теперь нам нужно просто загрузить эту анимацию в нашу активность и запустить ее, когда пользователь перемещает палец вверх и вниз. Итак, код нашей Деятельности выглядит так:
|
01
02
03
04
05
06
07
08
09
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
|
private Animation animUp;private Animation animDown;@Overridepublic void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); ll = (LinearLayout) findViewById(R.id.slider); ll.setVisibility(View.GONE); animUp = AnimationUtils.loadAnimation(this, R.anim.anim_up); animDown = AnimationUtils.loadAnimation(this, R.anim.anim_down);}@Overridepublic boolean onTouchEvent(MotionEvent event) { switch (event.getAction()) { case MotionEvent.ACTION_DOWN : { startY = event.getY(); break ; } case MotionEvent.ACTION_UP: { float endY = event.getY(); if (endY < startY) { System.out.println("Move UP"); ll.setVisibility(View.VISIBLE); ll.startAnimation(animUp); } else { ll.startAnimation(animDown); ll.setVisibility(View.GONE); } } } return true;} |