เลื่อนเค้าโครงขึ้นจากด้านล่างของหน้าจอ


93

ฉันมีเค้าโครงที่ซ่อนอยู่จากมุมมอง ในการคลิกปุ่มฉันต้องการให้มันเลื่อนขึ้นจากด้านล่างโดยดันเนื้อหาของหน้าจอทั้งหมดขึ้นไปคล้ายกับการที่ whatsapp แสดงแผงอิโมติคอนในหน้าจอแชท

ฉันเคยเห็น SlidingDrawer นั่นไม่ได้ผลสำหรับฉัน มันต้องใช้ภาพเป็นจุดจับซึ่งแสดงอยู่ตรงกลางหน้าจอฉันไม่ต้องการอย่างนั้น นอกจากนี้ยังเลื่อนไปที่เนื้อหาบนหน้าจอที่มีอยู่ฉันกำลังมองหาวิธีย้ายเนื้อหาที่มีอยู่ขึ้นไป

อัปเดต 1:

ฉันลองใช้แอนิเมชั่นตามที่ Sanket Kachhela แนะนำ แต่จะไม่แสดงเค้าโครงที่ซ่อนอยู่ นี่คือรหัส

เค้าโครง (activity_main.xml):

<RelativeLayout
    android:id="@+id/main_screen"
    android:layout_width="match_parent"
    android:layout_height="match_parent" >

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="@string/hello_world" 
        android:layout_alignParentTop="true"/>

     <TextView
       android:layout_width="wrap_content"
       android:layout_height="wrap_content"
       android:text="@string/hello_world" 
       android:layout_centerInParent="true"/>

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Slide up / down"
        android:layout_alignParentBottom="true" 
        android:onClick="slideUpDown"/>

</RelativeLayout>

<RelativeLayout
    android:id="@+id/hidden_panel"
    android:layout_width="match_parent"
    android:layout_height="wrap_content" 
    android:layout_below="@id/main_screen">

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="@string/app_name" />

</RelativeLayout>

กิจกรรม (MainActivity.java):

package com.example.slideuplayout;

import android.app.Activity;
import android.os.Bundle;
import android.view.Menu;
import android.view.View;
import android.view.ViewGroup;
import android.view.animation.Animation;
import android.view.animation.AnimationUtils;

public class MainActivity extends Activity {

private ViewGroup hiddenPanel;
private boolean isPanelShown;

@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_main);

    hiddenPanel = (ViewGroup)findViewById(R.id.hidden_panel);
    hiddenPanel.setVisibility(View.INVISIBLE);
    isPanelShown = false;
}

@Override
public boolean onCreateOptionsMenu(Menu menu) {
    // Inflate the menu; this adds items to the action bar if it is present.
    getMenuInflater().inflate(R.menu.main, menu);
    return true;
}

public void slideUpDown(final View view) {
    if(!isPanelShown) {
        // Show the panel
        Animation bottomUp = AnimationUtils.loadAnimation(this,
                R.anim.bottom_up);

        hiddenPanel.startAnimation(bottomUp);
        hiddenPanel.setVisibility(View.VISIBLE);
        isPanelShown = true;
    }
    else {
        // Hide the Panel
        Animation bottomDown = AnimationUtils.loadAnimation(this,
                R.anim.bottom_down);

        hiddenPanel.startAnimation(bottomDown);
        hiddenPanel.setVisibility(View.INVISIBLE);
        isPanelShown = false;
    }
}

}

ภาพเคลื่อนไหว:

bottom_up.xml:

<?xml version="1.0" encoding="utf-8"?>
 <set xmlns:android="http://schemas.android.com/apk/res/android">
    <translate 
       android:fromYDelta="75%p"
       android:toYDelta="0%p"
       android:fillAfter="true"
       android:duration="500" />
</set>

bottom_down.xml:

<?xml version="1.0" encoding="utf-8"?>
 <set xmlns:android="http://schemas.android.com/apk/res/android">
<translate 
    android:fromYDelta="0%p" 
    android:toYDelta="100%p" 
    android:fillAfter="true"
    android:interpolator="@android:anim/linear_interpolator"
    android:duration="500" />
</set>

ความคิดใด ๆ ที่สามารถทำได้?

ขอบคุณ.


1
คุณลองตอบแล้วหรือยัง?
Sanket Kachhela

1
เลย์เอาต์ hidden_panel ของคุณอาจอยู่หลังเลย์เอาต์อื่น ๆ โทรhiddenPanel.bringToFront()ก่อนเริ่มภาพเคลื่อนไหวและดูว่าใช้งานได้หรือไม่ นอกจากนี้ยังแจ้งให้เรารู้ว่าคุณจะได้รับมุมมอง hidden_panel ในรูปแบบกราฟิกสำหรับactivity_main.xml?
imthegiga

1
@Babar หมายถึงเมื่อคุณคลิกที่ปุ่มเลื่อนขึ้น / ลงเลย์เอาต์ที่ซ่อนอยู่ควรจะขยายหรือยุบตาม? i phone type slider?
TheFlash

1
@Babar คำตอบของฉันได้ผลหรือไม่?
superuser

1
คุณสามารถดูที่github.com/Ali-Rezaei/SlidingDrawerซึ่งช่วยให้คุณเลื่อนจากด้านใดก็ได้
อาลี

คำตอบ:


153

ใช้ภาพเคลื่อนไหวเหล่านี้:

bottom_up.xml

<?xml version="1.0" encoding="utf-8"?>
 <set xmlns:android="http://schemas.android.com/apk/res/android">
   <translate android:fromYDelta="75%p" android:toYDelta="0%p" 
    android:fillAfter="true"
 android:duration="500"/>
</set>

bottom_down.xml

 <?xml version="1.0" encoding="utf-8"?>
 <set xmlns:android="http://schemas.android.com/apk/res/android">

<translate android:fromYDelta="0%p" android:toYDelta="100%p" android:fillAfter="true"
            android:interpolator="@android:anim/linear_interpolator"
    android:duration="500" />

</set>

ใช้รหัสนี้ในกิจกรรมของคุณเพื่อซ่อน / เคลื่อนไหวมุมมองของคุณ:

Animation bottomUp = AnimationUtils.loadAnimation(getContext(),
            R.anim.bottom_up);
ViewGroup hiddenPanel = (ViewGroup)findViewById(R.id.hidden_panel);
hiddenPanel.startAnimation(bottomUp);
hiddenPanel.setVisibility(View.VISIBLE);

1
ฉันลองใช้รหัสด้านบน แต่มุมมองที่ซ่อนอยู่ไม่ปรากฏขึ้น ฉันได้อัปเดตคำถามและเพิ่มเค้าโครงและรหัสจาวา ขอบคุณ.
Babar

2
.setVisibility(View.VISIBLE)บันทึกวันของฉัน!
Si8

1
@sanket สวัสดีฉันใช้รหัสของคุณแล้วมันใช้งานได้ดี แต่ฉันต้องทำให้เธรดเข้าสู่โหมดสลีปสักพักแล้วฉันต้องใช้แอนิเมชั่นจากด้านล่างดังนั้นคุณช่วยฉันด้วยวิธีการนั้นได้ไหม
Anas Reza

1
ฉันคิดว่าคุณสามารถใช้ startOffset ได้ .. ดู doc developer.android.com/reference/android/view/animation/…
Sanket Kachhela

6
ก่อนที่ภาพเคลื่อนไหวจะเริ่มมีพื้นที่ว่างที่มุมมองของฉันจะไป มีความคิดอย่างไร
An-droid

42

คุณอยู่ใกล้ กุญแจสำคัญคือการทำให้เลย์เอาต์ที่ซ่อนอยู่ขยายmatch_parentทั้งความสูงและน้ำหนัก เพียงแค่เริ่มต้นView.GONEด้วย วิธีนี้การใช้เปอร์เซ็นต์ในแอนิเมเตอร์จะทำงานได้อย่างถูกต้อง

เค้าโครง (activity_main.xml):

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/main_screen"
    android:layout_width="match_parent"
    android:layout_height="match_parent" >

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentTop="true"
        android:text="@string/hello_world" />

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerInParent="true"
        android:text="@string/hello_world" />

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true"
        android:onClick="slideUpDown"
        android:text="Slide up / down" />

    <RelativeLayout
        android:id="@+id/hidden_panel"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:background="@android:color/white"
        android:visibility="gone" >

        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="@string/app_name"
            android:layout_centerInParent="true"
            android:onClick="slideUpDown" />
    </RelativeLayout>

</RelativeLayout>

กิจกรรม (MainActivity.java):

import android.app.Activity;
import android.os.Bundle;
import android.view.View;
import android.view.ViewGroup;
import android.view.animation.Animation;
import android.view.animation.AnimationUtils;

public class OffscreenActivity extends Activity {
    private View hiddenPanel;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.main_activity);

        hiddenPanel = findViewById(R.id.hidden_panel);
    }

    public void slideUpDown(final View view) {
        if (!isPanelShown()) {
            // Show the panel
            Animation bottomUp = AnimationUtils.loadAnimation(this,
                    R.anim.bottom_up);

            hiddenPanel.startAnimation(bottomUp);
            hiddenPanel.setVisibility(View.VISIBLE);
        }
        else {
            // Hide the Panel
            Animation bottomDown = AnimationUtils.loadAnimation(this,
                    R.anim.bottom_down);

            hiddenPanel.startAnimation(bottomDown);
            hiddenPanel.setVisibility(View.GONE);
        }
    }

    private boolean isPanelShown() {
        return hiddenPanel.getVisibility() == View.VISIBLE;
    }

}

มีเพียงสิ่งอื่นที่ฉันเปลี่ยนไปbottom_up.xmlเท่านั้น แทน

android:fromYDelta="75%p"

ฉันใช้:

android:fromYDelta="100%p"

แต่นั่นเป็นเรื่องของความชอบฉันคิดว่า


สิ่งนี้ไม่ได้ผลสำหรับฉันแผงที่ซ่อนอยู่จะปรากฏขึ้น แต่ข้อความที่แสดงแล้วบนหน้าจอถูกซ่อนอยู่และปุ่ม "เลื่อนขึ้น / ลง" กำลังเคลื่อนจากมุมไปที่กึ่งกลางของหน้าจอในแนวนอน
Babar

คุณบอกได้ไหมว่าทำไมเค้าโครงแบบเลื่อนจึงไม่ครอบคลุมส่วนประกอบอื่น ๆ ทั้งหมดในเค้าโครงหลัก ฉันประสบความสำเร็จในการติดตั้งรหัสของคุณ แต่สำหรับความต้องการของฉันฉันได้เพิ่มเลย์เอาต์เชิงเส้นอื่น ๆ ในเลย์เอาต์หลัก แต่เมื่อเค้าโครงเลื่อนปรากฏขึ้นก็ไม่สามารถครอบคลุมเค้าโครงเหล่านี้ได้
gabby

@gabby คุณอาจต้องตั้งค่าandroid:zAdjustment="top"บนAnimationหรือAnimtionSet.
Paul Burke

มันไม่ได้ผล ภาพเคลื่อนไหวของฉันเป็นเช่นนั้น: <? xml version = "1.0" encoding = "utf-8"?> <set xmlns: android = " schemas.android.com/apk/res/android "> <แปล android: fromYDelta = "0% p" android: toYDelta = "100% p" android: fillAfter = "true" android: interpolator = "@ android: anim / linear_interpolator" android: duration = "400" android: zAdjustment = "top" /> < / set>
gabby

3
ควรทำเครื่องหมายคำตอบที่ถูกต้อง ขอบคุณ @PaulBurke
RmK

9

คุณต้องเพิ่มบรรทัดในแอพของคุณโปรดค้นหาจากลิงค์ด้านล่าง:

แสดงและซ่อนมุมมองด้วยภาพเคลื่อนไหวแบบสไลด์ขึ้น / ลง

เพียงเพิ่มภาพเคลื่อนไหวลงในเค้าโครงของคุณดังนี้:

mLayoutTab.animate()
  .translationYBy(120)
  .translationY(0)
  .setDuration(getResources().getInteger(android.R.integer.config_mediumAnimTime));

7

นี่คือสิ่งที่ได้ผลสำหรับฉันในที่สุด

เลย์เอาต์:

activity_main.xml

<RelativeLayout
    android:id="@+id/main_screen"
    android:layout_width="match_parent"
    android:layout_height="match_parent" 
    android:layout_alignParentTop="true"
    android:layout_alignParentBottom="true">

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="@string/hello_world" 
        android:layout_alignParentTop="true"/>

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="@string/hello_world"
        android:layout_centerInParent="true" />

    <Button
        android:id="@+id/slideButton"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Slide up / down"
        android:layout_alignParentBottom="true" 
        android:onClick="slideUpDown"/>

</RelativeLayout>

hidden_panel.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/hidden_panel"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:orientation="vertical" >
    <Button
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="Test" />
</LinearLayout>

Java: แพ็คเกจ com.example.slideuplayout;

import android.app.Activity;
import android.os.Bundle;
import android.view.Menu;
import android.view.View;
import android.view.ViewGroup;
import android.view.ViewTreeObserver;
import android.view.ViewTreeObserver.OnGlobalLayoutListener;
import android.view.animation.Animation;
import android.view.animation.Animation.AnimationListener;
import android.view.animation.AnimationUtils;

public class MainActivity extends Activity {

private ViewGroup hiddenPanel;
private ViewGroup mainScreen;
private boolean isPanelShown;
private ViewGroup root;

int screenHeight = 0;

@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_main);

    mainScreen = (ViewGroup)findViewById(R.id.main_screen);
    ViewTreeObserver vto = mainScreen.getViewTreeObserver(); 
    vto.addOnGlobalLayoutListener(new OnGlobalLayoutListener() { 
        @Override 
        public void onGlobalLayout() { 
            screenHeight = mainScreen.getHeight();
            mainScreen.getViewTreeObserver().removeGlobalOnLayoutListener(this); 
        } 
    }); 

    root = (ViewGroup)findViewById(R.id.root);

    hiddenPanel = (ViewGroup)getLayoutInflater().inflate(R.layout.hidden_panel, root, false);
    hiddenPanel.setVisibility(View.INVISIBLE);

    root.addView(hiddenPanel);

    isPanelShown = false;
}

@Override
public boolean onCreateOptionsMenu(Menu menu) {
    // Inflate the menu; this adds items to the action bar if it is present.
    getMenuInflater().inflate(R.menu.main, menu);
    return true;
}

public void slideUpDown(final View view) {
    if(!isPanelShown) {
        // Show the panel
        mainScreen.layout(mainScreen.getLeft(),
                          mainScreen.getTop() - (screenHeight * 25/100), 
                          mainScreen.getRight(),
                          mainScreen.getBottom() - (screenHeight * 25/100));



        hiddenPanel.layout(mainScreen.getLeft(), mainScreen.getBottom(), mainScreen.getRight(), screenHeight);
        hiddenPanel.setVisibility(View.VISIBLE);

        Animation bottomUp = AnimationUtils.loadAnimation(this,
                R.anim.bottom_up);

        hiddenPanel.startAnimation(bottomUp);

        isPanelShown = true;
    }
    else {
        isPanelShown = false;

        // Hide the Panel
        Animation bottomDown = AnimationUtils.loadAnimation(this,
                R.anim.bottom_down);
        bottomDown.setAnimationListener(new AnimationListener() {

            @Override
            public void onAnimationStart(Animation arg0) {
                // TODO Auto-generated method stub

            }

            @Override
            public void onAnimationRepeat(Animation arg0) {
                // TODO Auto-generated method stub

            }

            @Override
            public void onAnimationEnd(Animation arg0) {
                isPanelShown = false;

                mainScreen.layout(mainScreen.getLeft(),
                          mainScreen.getTop() + (screenHeight * 25/100), 
                          mainScreen.getRight(),
                          mainScreen.getBottom() + (screenHeight * 25/100));

                hiddenPanel.layout(mainScreen.getLeft(), mainScreen.getBottom(), mainScreen.getRight(), screenHeight);
            }
        });
        hiddenPanel.startAnimation(bottomDown);
    }
}
}

1
@Babar รากคืออะไร
1baga

1
เป็นโครงร่างหลักที่ห่อหุ้ม main_screen ดูเหมือนว่าในการพยายามลบองค์ประกอบ UI ส่วนเกินฉันได้ลบออกจากโค้ดที่ฉันวางไว้ที่นี่ มันเป็นเลย์เอาต์เชิงเส้นหรือเชิงสัมพัทธ์
Babar

เป็นคำตอบที่ยอมรับและไม่มีองค์ประกอบรากและไม่มีอะไร ???? รับได้ยังไง ??
Zahan Safallwa

5

ใช้เค้าโครงนี้ หากคุณต้องการทำให้มุมมองหลักลดขนาดภาพเคลื่อนไหวคุณจะต้องเพิ่มภาพเคลื่อนไหวให้เท่ากับความสูงของแถบที่ซ่อนอยู่การซื้ออาจดีพอที่จะใช้แอนิเมชั่นการแปลบนแถบและให้ความสูงของมุมมองหลักกระโดดแทนการเคลื่อนไหว

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >

<RelativeLayout
    android:id="@+id/main_screen"
    android:layout_width="match_parent"
    android:layout_height="0dp"
    android:layout_weight="1" >

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentTop="true"
        android:text="@string/hello_world" />

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerInParent="true"
        android:text="@string/hello_world" />

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true"
        android:onClick="slideUpDown"
        android:text="Slide up / down" />
</RelativeLayout>

<RelativeLayout
    android:id="@+id/hidden_panel"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_gravity="bottom"
    android:background="#fcc"
    android:visibility="visible" >

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="@string/app_name" />
</RelativeLayout>

</LinearLayout>

ในการคลิกปุ่ม 'เลื่อนขึ้น' ฉันกำลังเปลี่ยนตำแหน่งของ main_screen และพาเนลที่ซ่อนอยู่โดยทางโปรแกรมโดยเรียกใช้วิธีการจัดวางจากนั้นฉันเรียก startAnimation ในมุมมองที่ซ่อนอยู่ สิ่งนี้ทำให้แผงที่ซ่อนอยู่ปรากฏขึ้นในสถานที่ แต่ด้วยเหตุผลบางประการปุ่มในแผงควบคุมจึงไม่ปรากฏขึ้น แผงว่างเปล่า เบาะแสใด ๆ ที่ทำให้ปุ่มไม่ปรากฏขึ้น?
Babar

คุณควรเปลี่ยนการแสดงแผงที่ซ่อนอยู่เพื่อให้มองเห็นได้ จากคำอธิบายของคุณฉันคาดเดาว่าการแสดงปุ่มเปลี่ยนไปหรือความกว้าง / ความสูงของปุ่มเป็นศูนย์
yoah

4

โอเคมีสองวิธีที่เป็นไปได้ ง่ายที่สุด - คือการใช้ไลบรารีเมนูแบบเลื่อน อนุญาตให้สร้างเมนูเลื่อนด้านล่างสามารถทำให้คอนเทนเนอร์ด้านบนเคลื่อนไหวเพื่อให้มองเห็นด้านล่างได้รองรับทั้งการลากด้วยนิ้วของคุณหรือทำให้เคลื่อนไหวโดยใช้โปรแกรมผ่านปุ่ม (StaticDrawer)

วิธีที่ยากกว่า - หากคุณต้องการใช้แอนิเมชั่นตามที่แนะนำไปแล้ว ด้วยภาพเคลื่อนไหวคุณต้องเปลี่ยนเลย์เอาต์ของคุณก่อน ดังนั้นพยายามทำให้เค้าโครงของคุณเปลี่ยนเป็นสถานะสุดท้ายก่อนโดยไม่มีภาพเคลื่อนไหวใด ๆ เนื่องจากมีโอกาสมากที่คุณจะวางมุมมองของคุณไม่ถูกต้องใน RelativeLayout ดังนั้นแม้ว่าคุณจะแสดงมุมมองด้านล่างของคุณ แต่มุมมองด้านบนก็ยังคงถูกบดบัง เมื่อคุณเปลี่ยนเค้าโครงได้อย่างเหมาะสมแล้วสิ่งที่คุณต้องทำคือจำคำแปลก่อนจัดวางและใช้แอนิเมชั่นการแปลหลังจากเค้าโครง


ปุ่มบนแผงที่ซ่อนอยู่ไม่ปรากฏขึ้นอาจเป็นเพราะแผงปิดหน้าจอ สิ่งที่ฉันทำคือซ่อนเค้าโครงไว้และอยู่บนหน้าจอจากนั้นใช้ภาพเคลื่อนไหวเพื่อวางไว้ในตำแหน่งที่ถูกต้อง
Babar

4
ฉันไม่คิดว่า SlidingMenu อนุญาตจากด้านล่าง ซ้ายขวาเท่านั้นฉันเชื่อ
wkhatch

2
@wkhatch ถูกต้อง BOTTOM SlidingMenu แสดงข้อยกเว้น: "โหมด SlidingMenu ต้องเป็น LEFT, RIGHT หรือ LEFT_RIGHT" ซึ่งสอดคล้องกับเอกสารและตรงข้ามกับคำตอบนี้
ajwest

4

รหัสของฉันในการทำให้แอนิเมชั่นเลื่อนขึ้นเลื่อนลงโดยไม่มี XML

private static ObjectAnimator createBottomUpAnimation(View view,
        AnimatorListenerAdapter listener, float distance) {
    ObjectAnimator animator = ObjectAnimator.ofFloat(view, "translationY", -distance);
//        animator.setDuration(???)
    animator.removeAllListeners();
    if (listener != null) {
        animator.addListener(listener);
    }
    return animator;
}

public static ObjectAnimator createTopDownAnimation(View view, AnimatorListenerAdapter listener,
        float distance) {
    view.setTranslationY(-distance);
    ObjectAnimator animator = ObjectAnimator.ofFloat(view, "translationY", 0);
    animator.removeAllListeners();
    if (listener != null) {
        animator.addListener(listener);
    }
    return animator;
}

ใช้ สำหรับเลื่อนลง

createTopDownAnimation(myYellowView, null, myYellowView.getHeight()).start();

สำหรับสไลด์ขึ้น

createBottomUpAnimation(myYellowView, null, myYellowView.getHeight()).start();

ป้อนคำอธิบายภาพที่นี่


3

ลองใช้โค้ดด้านล่างนี้สั้นและเรียบง่าย

transalate_anim.xml

<?xml version="1.0" encoding="utf-8"?><!-- Copyright (C) 2013 The Android Open Source Project

     Licensed under the Apache License, Version 2.0 (the "License");
     you may not use this file except in compliance with the License.
     You may obtain a copy of the License at

          http://www.apache.org/licenses/LICENSE-2.0

     Unless required by applicable law or agreed to in writing, software
     distributed under the License is distributed on an "AS IS" BASIS,
     WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
     See the License for the specific language governing permissions and
     limitations under the License.
-->
<set xmlns:android="http://schemas.android.com/apk/res/android">
    <translate
        android:duration="4000"
        android:fromXDelta="0"
        android:fromYDelta="0"
        android:repeatCount="infinite"
        android:toXDelta="0"
        android:toYDelta="-90%p" />

    <alpha xmlns:android="http://schemas.android.com/apk/res/android"
        android:duration="4000"
        android:fromAlpha="0.0"
        android:repeatCount="infinite"
        android:toAlpha="1.0" />
</set>

activity_main.xml

<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context="com.naveen.congratulations.MainActivity">


    <ImageView
        android:id="@+id/image_1"
        android:layout_width="50dp"
        android:layout_height="50dp"
        android:layout_marginBottom="8dp"
        android:layout_marginStart="8dp"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintLeft_toLeftOf="parent"
        app:srcCompat="@drawable/balloons" />
</android.support.constraint.ConstraintLayout>

MainActivity.java

public class MainActivity extends AppCompatActivity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        final ImageView imageView1 = (ImageView) findViewById(R.id.image_1);
        imageView1.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {
                startBottomToTopAnimation(imageView1);
            }
        });

    }

    private void startBottomToTopAnimation(View view) {
        view.startAnimation(AnimationUtils.loadAnimation(this, R.anim.translate_anim));
    }
}

bottom_up_navigation ของรูปภาพ


2

นี่คือโซลูชันที่เป็นส่วนขยายของ [ https://stackoverflow.com/a/46644736/10249774]

แผงด้านล่างกำลังดันเนื้อหาหลักขึ้น

https://imgur.com/a/6nxewE0

activity_main.xml

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".MainActivity">
<Button
    android:id="@+id/my_button"
    android:layout_marginTop="10dp"
    android:onClick="onSlideViewButtonClick"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"/>
<LinearLayout
android:id="@+id/main_view"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:gravity="center_horizontal">
<TextView
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="main "
    android:textSize="70dp"/>
<TextView
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="main "
    android:textSize="70dp"/>
<TextView
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="main "
    android:textSize="70dp"/>
<TextView
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="main"
    android:textSize="70dp"/>
<TextView
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="main"
    android:textSize="70dp"/>
</LinearLayout>
<LinearLayout
    android:id="@+id/footer_view"
    android:background="#a6e1aa"
    android:orientation="vertical"
    android:gravity="center_horizontal"
    android:layout_alignParentBottom="true"
    android:layout_width="match_parent"
    android:layout_height="wrap_content">
    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="footer content"
        android:textSize="40dp" />
    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="footer content"
        android:textSize="40dp" />
  </LinearLayout>
</RelativeLayout>

กิจกรรมหลัก:

import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.View;
import android.view.animation.TranslateAnimation;
import android.widget.Button;

public class MainActivity extends AppCompatActivity {
private Button myButton;
private View footerView;
private View mainView;
private boolean isUp;
private int anim_duration = 700;

@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_main);

    footerView = findViewById(R.id.footer_view);
    mainView = findViewById(R.id.main_view);
    myButton = findViewById(R.id.my_button);

    // initialize as invisible (could also do in xml)
    footerView.setVisibility(View.INVISIBLE);
    myButton.setText("Slide up");
    isUp = false;
}
public void slideUp(View mainView , View footer_view){
    footer_view.setVisibility(View.VISIBLE);
    TranslateAnimation animate_footer = new TranslateAnimation(
            0,                 // fromXDelta
            0,                 // toXDelta
            footer_view.getHeight(),  // fromYDelta
            0);                // toYDelta
    animate_footer.setDuration(anim_duration);
    animate_footer.setFillAfter(true);
    footer_view.startAnimation(animate_footer);

    mainView.setVisibility(View.VISIBLE);
    TranslateAnimation animate_main = new TranslateAnimation(
            0,                 // fromXDelta
            0,                 // toXDelta
            0,  // fromYDelta
            (0-footer_view.getHeight()));                // toYDelta
    animate_main.setDuration(anim_duration);
    animate_main.setFillAfter(true);
    mainView.startAnimation(animate_main);
}
public void slideDown(View mainView , View footer_view){
    TranslateAnimation animate_footer = new TranslateAnimation(
            0,                 // fromXDelta
            0,                 // toXDelta
            0,                 // fromYDelta
            footer_view.getHeight()); // toYDelta
    animate_footer.setDuration(anim_duration);
    animate_footer.setFillAfter(true);
    footer_view.startAnimation(animate_footer);


    TranslateAnimation animate_main = new TranslateAnimation(
            0,                 // fromXDelta
            0,                 // toXDelta
            (0-footer_view.getHeight()),  // fromYDelta
            0);                // toYDelta
    animate_main.setDuration(anim_duration);
    animate_main.setFillAfter(true);
    mainView.startAnimation(animate_main);
}

public void onSlideViewButtonClick(View view) {
    if (isUp) {
        slideDown(mainView , footerView);
        myButton.setText("Slide up");
    } else {
        slideUp(mainView , footerView);
        myButton.setText("Slide down");
    }
    isUp = !isUp;
}
}

1

คุณสามารถกำหนดหน้าจอหลักและหน้าจออื่นที่คุณต้องการเลื่อนขึ้นเป็นส่วนย่อย เมื่อกดปุ่มบนหน้าจอหลักแฟรกเมนต์จะส่งข้อความไปยังกิจกรรมซึ่งจะแทนที่หน้าจอหลักด้วยหน้าจอหลักที่คุณต้องการเลื่อนขึ้นและทำให้ส่วนที่เปลี่ยนเป็นเคลื่อนไหว


1
ฉันแค่ต้องการให้หน้าจอดันขึ้นโดยแผงที่ซ่อนอยู่เมื่ออยู่บนหน้าจอ ฉันไม่ต้องการแทนที่เนื้อหา / ส่วนของหน้าจอ ฉันจัดการเพื่อให้มันทำงานร่วมกับภาพเคลื่อนไหวและการปรับแต่งเค้าโครง
Babar
โดยการใช้ไซต์ของเรา หมายความว่าคุณได้อ่านและทำความเข้าใจนโยบายคุกกี้และนโยบายความเป็นส่วนตัวของเราแล้ว
Licensed under cc by-sa 3.0 with attribution required.