2016-12-05 30 views
1

我創建了一個新的小例子來解釋我的新問題。在這個例子中,我創建了一個填充整個屏幕的RelativeLayout。和3個孩子:如何填充佈局中的剩餘空間而不透支其他元素?

  1. 自定義視圖(PVIEW)創建,繪製,必須由寬度在肖像模式和自由空間的高度在橫向模式填補所有可用空間,而不覆蓋在上面,FrameLayout裏的底部(粉紅色)比例視圖
  2. 的FrameLayout id爲頂部必須表現出中等以上(紅色)
  3. 的FrameLayout id爲底部必須出現如下圖所示中間(黃色)

但現在在橫向模式下中間項透支頂部和底部。有沒有人idieas如何解決它?

佈局:

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

    <FrameLayout 
     android:id="@+id/top" 
     android:layout_width="100dp" 
     android:layout_height="24dp" 
     android:layout_above="@+id/middle" 
     android:layout_centerHorizontal="true" 
     android:background="#FFFF0000" /> 


    <test.com.heighttest.PView 
     android:id="@+id/middle" 
     android:layout_width="match_parent" 
     android:layout_height="match_parent" 
     android:layout_centerInParent="true" 
     android:background="#FFFF00FF" /> 


    <FrameLayout 
     android:id="@+id/bottom" 
     android:layout_width="100dp" 
     android:layout_height="24dp" 
     android:layout_below="@+id/middle" 
     android:layout_centerHorizontal="true" 
     android:background="#FFFFFF00" /> 

</RelativeLayout> 

PView.java

package test.com.heighttest; 

import android.content.Context; 
import android.util.AttributeSet; 
import android.widget.RelativeLayout; 


/** 
* Created by Anton Potekhin ([email protected]) on 26.09.16. 
*/ 
public class PView extends RelativeLayout { 

    public static final int USE_FOR_SCALE_WIDTH = 0; 
    public static final int USE_FOR_SCALE_HEIGHT = 1; 

    public int getUseForScale() { 
     return useForScale; 
    } 

    public void setUseForScale(int useForScale) { 
     this.useForScale = useForScale; 
    } 

    private int useForScale = 0; 

    public float getAspectRatio() { 
     return aspectRatio; 
    } 

    public void setAspectRatio(float aspectRatio) { 
     this.aspectRatio = aspectRatio; 
    } 

    /** 
    * Aspect ratio to calculate size of view. Set 0 to not use aspect ratio (Works like RelativeLayout). 
    */ 
    private float aspectRatio = 0; 

    public PView(Context context) { 
     super(context); 
    } 

    public PView(Context context, AttributeSet attrs) { 
     super(context, attrs); 

    } 


    @Override 
    protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) { 
     //Use aspect ratio only if it more than 0 
     if (aspectRatio > 0) { 
      int width = MeasureSpec.getSize(widthMeasureSpec); 
      int height = MeasureSpec.getSize(heightMeasureSpec); 

      if (useForScale == USE_FOR_SCALE_WIDTH) { 
       height = Math.round(width/aspectRatio); 
      } else { 
       width = Math.round(height * aspectRatio); 
      } 
      widthMeasureSpec = MeasureSpec.makeMeasureSpec(width, MeasureSpec.EXACTLY); 
      heightMeasureSpec = MeasureSpec.makeMeasureSpec(height, MeasureSpec.EXACTLY); 
     } 
     super.onMeasure(widthMeasureSpec, heightMeasureSpec); 
    } 
} 

MainActivity.java

package test.com.heighttest; 

import android.content.res.Configuration; 
import android.support.v7.app.AppCompatActivity; 
import android.os.Bundle; 

public class MainActivity extends AppCompatActivity { 

    private PView middleView; 

    @Override 
    protected void onCreate(Bundle savedInstanceState) { 
     super.onCreate(savedInstanceState); 
     com.facebook.stetho.Stetho.initializeWithDefaults(this); 
     setContentView(R.layout.activity_main); 
     middleView = (PView) findViewById(R.id.middle); 
     middleView.setAspectRatio(1.2f); 
     if (this.getResources().getConfiguration().orientation == Configuration.ORIENTATION_LANDSCAPE) { 
      middleView.setUseForScale(PView.USE_FOR_SCALE_HEIGHT); 
     } else { 
      middleView.setUseForScale(PView.USE_FOR_SCALE_WIDTH); 
     } 
    } 
} 

截圖在肖像模式(正常工作):在橫向模式

enter image description here

截圖(工作不正確,因爲中間透支頂部和底部):

enter image description here

截圖我想要進入橫向模式

enter image description here


解決方案通過@尼迪-潘迪亞(與我的修正):

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" 
    android:id="@+id/activity_main" 
    android:layout_width="match_parent" 
    android:layout_height="wrap_content"> 

    <LinearLayout 
     android:layout_width="match_parent" 
     android:layout_height="match_parent" 
     android:gravity="center" 
     android:orientation="vertical"> 

     <FrameLayout 
      android:id="@+id/top" 
      android:layout_width="100dp" 
      android:layout_height="24dp" 
      android:background="#FFFF0000" /> 


     <test.com.heighttest.PView 
      android:id="@+id/middle" 
      android:layout_width="match_parent" 
      android:layout_height="match_parent" 
      android:layout_weight="1" 
      android:background="#FFFF00FF" /> 


     <FrameLayout 
      android:id="@+id/bottom" 
      android:layout_width="100dp" 
      android:layout_height="24dp" 
      android:background="#FFFFFF00" /> 

    </LinearLayout> 
</RelativeLayout> 
+0

的可能的複製[如何填寫父相對佈局中的所有空間?(http://stackoverflow.com/questions/40935591/how-to-fill-all-space-in-parent-relative-佈局) – AlphaQ

+0

它不重複。因爲它具有不同的中間項目行爲 – Anton111111

+0

不要創建語義上相同的問題。重複已被指出,因爲兩者都是來自你的同樣的問題。請理解佈局系統,但不要問你想要的每一個小改動的問題。據我所知,你只需要一個相對於另一個視圖的位置,再加上該視圖的一半大小。檢查'addRule'函數來定位相對視圖 – Bonatti

回答

0

添加的LinearLayout下面的RelativeLayout,並使用其定位到您的內容垂直排列。使用alignparenttop,alignparentbottom和centerinparent屬性。它會在兩個方向給你相同的輸出。

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" 
     android:id="@+id/activity_main" 
     android:layout_width="match_parent" 
     android:layout_height="wrap_content"> 

     <LinearLayout 
      android:layout_width="match_parent" 
      android:layout_height="match_parent" 
      android:gravity="center" 
      android:orientation="vertical"> 

      <FrameLayout 
       android:id="@+id/top" 
       android:layout_width="80dp" 
       android:layout_height="50dp" 
       android:layout_alignParentTop="true" 
       android:layout_centerHorizontal="true" 
       android:layout_marginTop="15dp" 
       android:background="#FFFF0000" /> 


      <test.com.heighttest.PView 
      android:id="@+id/middle" 
      android:layout_width="match_parent" 
      android:layout_height="match_parent" 
      android:layout_centerInParent="true" 
      android:background="#FFFF00FF" /> 


      <FrameLayout 
       android:id="@+id/bottom" 
       android:layout_width="80dp" 
       android:layout_height="50dp" 
       android:layout_alignParentBottom="true" 
       android:layout_centerHorizontal="true" 
       android:layout_marginBottom="15dp" 
       android:background="#FFFFFF00" /> 

     </LinearLayout> 
    </RelativeLayout> 
+0

嗯我改變你的佈局大小,我看到它的作品不完全正確。此外,alignparenttop,alignparentbottom和centerinparent屬性在linearlayout內不起作用。但無論如何,謝謝你給我正確的方式來解決我的問題。我張貼在右上角的解決方案 – Anton111111

+0

很高興幫助你.. @ Anton111111 –