底部的对话框幻灯片-Android

Question

我想显示一个类似于用户在地图上选择一个地点时显示的对话框。 您可以在图1，图2和图3中看到它。此对话框就像一个片段，可以全屏显示和部分显示，如果不想再看到它，可以滑出。 在这一刻，我只有一个带有动画的对话框，该动画的样式在提示对话框时是一种样式，而在取消对话框时则具有另一种样式，如图4所示。这不是预期的行为，因为我想与对话框而不应用简单的动画。

问题

1. 我认为Google地图对话框就像一个片段，但是我不知道如何部分显示它，然后以全屏模式显示它。 ¿我可以使用片段吗？ ¿我可以仅停用此Fragment的ViewPager父级幻灯片吗？

2. ¿还有其他建议来做类似Google Maps应用程序对话框的对话框吗？

谢谢。

图1

图2

图3

图4

Answer 1

我解决我的问题适应的一些元素这个 （感谢赛义夫·哈米德）和管理触摸事件的动画对话框。 它不是完美的，因为动画不是很流畅，但是可以正常工作。 这是涉及的代码：

i）我将对话框布局覆盖到摄像机布局

    <?xml version="1.0" encoding="utf-8"?>
    <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="vertical" >

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

            <!-- Camera Preview -->

            <com.easyshopping.activities.CameraPreview
                android:id="@+id/cameraSurfaceView"
                android:layout_width="match_parent"
                android:layout_height="match_parent" >
            </com.easyshopping.activities.CameraPreview>

            <!-- Dialog layout -->

            <RelativeLayout
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:id="@+id/layoutDialogProduct"
                android:layout_gravity="center_horizontal"
                android:background="@color/white"
                android:orientation="vertical" >

                <LinearLayout
                    android:id="@+id/layoutUpRegister"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_alignParentTop="true"
                    android:layout_marginTop="30dp"
                    android:orientation="horizontal" >

                    <TextView
                        android:id="@+id/textViewLabelNickname"
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:layout_marginLeft="20dp"
                        android:text="@string/label_register_nickname" />

                    <EditText
                        android:id="@+id/editTextNickname"
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:layout_marginLeft="20dp"
                        android:ems="10"
                        android:inputType="textPersonName" >
                    </EditText>
                </LinearLayout>

                <LinearLayout
                    android:id="@+id/layoutMediumRegister"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_below="@+id/layoutUpRegister"
                    android:layout_marginTop="20dp" >

                    <TextView
                        android:id="@+id/textViewLabelEmail"
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:layout_marginLeft="20dp"
                        android:text="@string/label_register_email" />

                    <EditText
                        android:id="@+id/editTextEmail"
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:layout_marginLeft="45dp"
                        android:ems="10"
                        android:inputType="textEmailAddress" />
                </LinearLayout>

                <LinearLayout
                    android:id="@+id/layoutBottomRegister"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_below="@+id/layoutMediumRegister"
                    android:layout_marginTop="20dp" >

                    <TextView
                        android:id="@+id/textViewLabelPassword"
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:layout_marginLeft="20dp"
                        android:text="@string/label_register_password" />

                    <EditText
                        android:id="@+id/editTextPassword"
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:layout_marginLeft="20dp"
                        android:ems="10"
                        android:inputType="textPassword" />
                </LinearLayout>

                <Button
                    android:id="@+id/btnOkRegister"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_alignParentRight="true"
                    android:layout_below="@+id/layoutBottomRegister"
                    android:layout_marginRight="20dp"
                    android:layout_marginTop="40dp"
                    android:text="@string/positive_button" />

                <Button
                    android:id="@+id/btnCancelRegister"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_alignParentLeft="true"
                    android:layout_below="@+id/layoutBottomRegister"
                    android:layout_marginLeft="20dp"
                    android:layout_marginTop="40dp"
                    android:text="@string/negative_button" />
            </RelativeLayout>
    </LinearLayout> 

ii）动画和触摸事件

// DIALOG SLIDER

    // Effects when overlay layout
    final OvershootInterpolator intp = new OvershootInterpolator();

    // Animation duration
    final int d = getResources().getInteger(android.R.integer.config_shortAnimTime);

    // Dialog layout
    final RelativeLayout layoutDialogProduct = (RelativeLayout) rootView.findViewById(R.id.layoutDialogProduct);

    // ViewTreeObserver of dialog to get its height
    ViewTreeObserver vto = rootView.findViewById(R.id.layoutDialogProduct).getViewTreeObserver();
    vto.addOnGlobalLayoutListener(new OnGlobalLayoutListener() {

        @Override
        public void onGlobalLayout() {
            // TODO Auto-generated method stub

            headerDialogHeight = rootView.findViewById(R.id.layoutDialogProduct).getHeight();

            // Removel OnGlobalLayoutListener
            ViewTreeObserver obs = rootView.findViewById(R.id.layoutDialogProduct).getViewTreeObserver();

            if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.JELLY_BEAN) {
                obs.removeOnGlobalLayoutListener(this);
            } else {
                obs.removeGlobalOnLayoutListener(this);
            }

            // ViewTreeObserver of cameraview to get its height

            ViewTreeObserver vto2 = mPreview.getViewTreeObserver();
            vto2.addOnGlobalLayoutListener(new OnGlobalLayoutListener() {

                @Override
                public void onGlobalLayout() {
                    // TODO Auto-generated method stub
                    heightCameraView = mPreview.getHeight();

                    // Get spacing error when show the dialog
                    int tY = heightCameraView - headerDialogHeight;

                    // Remove ViewTreeObserver
                    ViewTreeObserver obs2 = mPreview.getViewTreeObserver();

                    if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.JELLY_BEAN) {
                        obs2.removeOnGlobalLayoutListener(this);
                    } else {
                        obs2.removeGlobalOnLayoutListener(this);
                    }

                    //Do animation
                    layoutDialogProduct.animate().translationY(tY).setDuration(d).setInterpolator(intp).start();

                }
            });

        }
    });

    layoutDialogProduct.setOnTouchListener(new OnTouchListener() {

        @Override
        public boolean onTouch(View v, MotionEvent event) {
            // TODO Auto-generated method stub
            viewPager.setmIsUnableToDrag(false);

            // float x = event.getX();
            float y = event.getY();

            switch (event.getAction()) {

                case MotionEvent.ACTION_MOVE : {
                    // Hacer la animación

                    if (headerDialogHeight - y <= headerDialogHeight) {
                        layoutDialogProduct.animate().translationY(heightCameraView - headerDialogHeight + y)
                                .setDuration(d).setInterpolator(intp).start();
                    }

                    break;
                }
            }

            viewPager.setmIsUnableToDrag(true);
            return true;
        }
    });

屏幕截图