2014-02-25 42 views
0

我想顯示一個對話框,類似於用戶在地圖上選擇地點時Google地圖應用顯示的對話框。你可以在圖1,圖2和圖3中看到它。這個對話框就像片段,我可以在全屏和部分模式下顯示,當我不想再看到它時,我可以滑出。在這一刻,我只有一個動畫對話框,當對話框被提示時有一個樣式,當另一個對話框被解散時,你可以在圖4中看到。這不是預期的行爲,因爲我想要與對話框而不應用簡單的動畫。底部的對話框幻燈片 - Android

問題

  1. 我認爲,谷歌地圖對話就像是一個片段,但我不知道我可以部分地表現出來,然後顯示它在全屏模式下。我可以用碎片來做到這一點嗎? ¿是否可以僅將ViewPager父項的幻燈片停用到此片段?

  2. ¿您有任何其他建議可以執行Google地圖應用對話框之類的對話嗎?

謝謝。

圖1 Figure 1

圖2 Figure 2

圖3 Figure 3

圖4 Figure 4

+1

查看[this](http://blog.neteril.org/blog/2013/10/10/framelayout-your-best-ui-friend/) –

回答

0

我解決了我的問題,使this(感謝Saif Hamed)的一些元素適應並管理觸摸事件來爲對話框設置動畫。這並不完美,因爲動畫不是很流暢,但它的工作原理。這是所涉及的代碼:

我)我覆蓋的對話框佈局攝像機佈局

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

截圖 Screenshot 1

Screenshot 2

Screenshot 3