Question

在我的应用程序中，当用户点击联系人图标时，我想在幻灯片中显示联系人信息，该信息从底部显示，可以向上扫描以覆盖整个屏幕，或者向下滑动到消失。

我尝试使用umano的SlidingUpPanel，但我无法让它按照我的需要工作，因为它不是为此而设计的。

那里有一些图书馆吗？

Answer 1

这在Android中称为BottomSheet。您可以使用视图作为协调器布局的子项创建自己的底部工作表。

添加到您的应用build.gradle：

dependencies{
    compile 'com.android.support:design:24.1.1'
}

然后使用这些类创建自己的类：

https://jsfiddle.net/codeandcloud/ky60oc3t/

BottomSheetDialogFragment

BottomSheetDialog

BottomSheetBehavior

这是一个过于简化的演示，演示如何使FrameLayout充当底部工作表，您可以使用Fragment替换FrameLayout的内容，并根据需要将信息传递给它。（在您的情况下，无论点击哪个联系人）：

布局：

<?xml version="1.0" encoding="utf-8"?>
<android.support.design.widget.CoordinatorLayout 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"
    android:fitsSystemWindows="true"
    tools:context="com.sample.bottomsheetsample.MainActivity">

    <android.support.design.widget.AppBarLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:theme="@style/AppTheme.AppBarOverlay">

        <android.support.v7.widget.Toolbar
            android:id="@+id/toolbar"
            android:layout_width="match_parent"
            android:layout_height="?attr/actionBarSize"
            android:background="?attr/colorPrimary"
            app:popupTheme="@style/AppTheme.PopupOverlay" />

    </android.support.design.widget.AppBarLayout>

    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:paddingBottom="@dimen/activity_vertical_margin"
        android:paddingLeft="@dimen/activity_horizontal_margin"
        android:paddingRight="@dimen/activity_horizontal_margin"
        android:paddingTop="@dimen/activity_vertical_margin"
        app:layout_behavior="@string/appbar_scrolling_view_behavior"
        tools:context="com.kdotj.bottomsheetsample.MainActivity"
        tools:showIn="@layout/activity_main">

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Hello World!" />
    </RelativeLayout>

    <android.support.design.widget.FloatingActionButton
        android:id="@+id/fab"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="bottom|end"
        android:layout_margin="@dimen/fab_margin"
        android:src="@android:drawable/ic_dialog_email" />

    <!-- Notice a few things: 
        app:layout_behavior="@string/bottom_sheet_behavior" required to act as bottom sheet
        app:behavior_peekHeight="244dp" this is the collapsed state height
        app:behavior_hideable="true" lets you swipe to dismiss the sheet
        android:elevation="@dimen/design_appbar_elevation" puts the sheet over the action bar
    -->
    <FrameLayout
        android:id="@+id/fl_bottomSheet"
        app:layout_behavior="@string/bottom_sheet_behavior"
        app:behavior_peekHeight="244dp"
        app:behavior_hideable="true"
        android:elevation="@dimen/design_appbar_elevation"
        android:background="#777"
        android:layout_width="match_parent"
        android:layout_height="match_parent">

        <android.support.v7.widget.AppCompatTextView
            android:layout_gravity="center|top"
            android:text="Hello, Bottom Sheet!"
            android:padding="16dp"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content" />

    </FrameLayout>

</android.support.design.widget.CoordinatorLayout>

活动：

public class MainActivity extends AppCompatActivity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);
        setSupportActionBar(toolbar);
        FrameLayout frameLayout = (FrameLayout) findViewById(R.id.fl_bottomSheet);
        final BottomSheetBehavior behavior = BottomSheetBehavior.from(frameLayout);
        behavior.setBottomSheetCallback(new BottomSheetBehavior.BottomSheetCallback() {
            @Override
            public void onStateChanged(@NonNull View bottomSheet, int newState) {
                //... Handle the state changes
            }

            @Override
            public void onSlide(@NonNull View bottomSheet, float slideOffset) {
                //.. handle sliding if you want to
            }
        });

        FloatingActionButton fab = (FloatingActionButton) findViewById(R.id.fab);
        fab.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {
                behavior.setState(BottomSheetBehavior.STATE_COLLAPSED);
            }
        });
    }
}

像Nexus手机上的现有拨号器一样向上滑动面板

1 个答案: