android中的全高方形元素

时间:2016-02-21 11:03:12

标签: android android-layout gridview landscape-portrait

我想要一个正方形(与高度相同的宽度)GridView以横向方向填充屏幕的整个高度。 Gridview是一个棋盘(8乘8个方格),带有xml:

<com.example.jens.jchess2.view.MyGridView
    android:id="@+id/chessboard"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:padding="0dp"
    android:numColumns="8"
    android:verticalSpacing="0dp"
    android:horizontalSpacing="0dp">
</com.example.jens.jchess2.view.MyGridView>

并且网格的元素是:

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/square"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:background="#000080"
    android:orientation="vertical"
    android:padding="0pt">

    <ImageView
        android:id="@+id/square_background"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:adjustViewBounds="true"
        android:padding="0pt" />


    <ImageView
        android:id="@+id/piece"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        android:adjustViewBounds="true"
        android:padding="0pt" />

</FrameLayout> 

,其中ImageViews对应于棋盘的正方形和棋子(均来自png图像)。

在自定义MyGridView中,我重写onMeasure,如下所示:

@Override
protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
    int width = MeasureSpec.getSize(widthMeasureSpec);
    int height = getContext().getResources().getDisplayMetrics().heightPixels;


    if (width > height) {
        super.onMeasure(
                MeasureSpec.makeMeasureSpec(height, MeasureSpec.EXACTLY),
                MeasureSpec.makeMeasureSpec(height, MeasureSpec.EXACTLY)
        );
    } else {
        super.onMeasure(
                MeasureSpec.makeMeasureSpec(width, MeasureSpec.EXACTLY),
                MeasureSpec.makeMeasureSpec(width, MeasureSpec.EXACTLY)
        );
    }
}

它为我提供了纵向和横向的方形GridView。在纵向模式下,它填充整个宽度,一切都很好。在横向模式下,它会延伸到屏幕下方,因为GridView /板的高度(=宽度)太大。根据工具栏的高度和状态栏的高度,它太大了。如何获得GridView的正确大小,即屏幕高度减去状态栏高度减去工具栏高度?

2 个答案:

答案 0 :(得分:0)

从两个版本的布局文件开始:

/res/layout/grid.xml

   ...

    <!-- full width -->
    <com.example.MyGridView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        ...
        />

   ...

/res/layout-land/grid.xml

   ...

    <!-- full height -->
    <com.example.MyGridView
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        ...
        />

   ...

你可能已经有类似的东西了。

现在,在onMeasure()覆盖中,match_parent维度的MeasureSpec模式为EXACTLYwrap_content维度将为MeasureSpec AT_MOST的模式。您可以使用它来实现所需的布局。

@Override
protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {

    int width = MeasureSpec.getSize(widthMeasureSpec);
    int height = MeasureSpec.getSize(heightMeasureSpec);
    int widthMode = MeasureSpec.getMode(widthMeasureSpec);
    int heightMode = MeasureSpec.getMode(heightMeasureSpec);


    if (widthMode == MeasureSpec.EXACTLY && heightMode == MeasureSpec.AT_MOST) {
        // portrait
        super.onMeasure(widthMeasureSpec, widthMeasureSpec);

    } else if (heightMode == MeasureSpec.EXACTLY && widthMode == MeasureSpec.AT_MOST) {
        // landscape
        super.onMeasure(heightMeasureSpec, heightMeasureSpec);

    } else {
        super.onMeasure(widthMeasureSpec, heightMeasureSpec);
    }
}

编辑:我发现两种模式都可以是AT_MOST,具体取决于ViewGroup容器。有关更新的测量代码,请参阅我的其他答案。

答案 1 :(得分:0)

阿。现在我看到这是一场比赛。

有时最好有布局和子视图,但在大多数情况下使用游戏板你最好创建一个代表游戏视图的View子类。

例如,如果您的用户说他们希望能够缩放到游戏板的一个象限,该怎么办?你不能用GridView

来做到这一点

我制作了一个简单的应用程序,向您展示这是如何工作的。我简化了之前发布的onMeasure()代码,而不是GridView,而是一个View子类渲染游戏板。

MainActivity只是设置内容视图。

/res/layout/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"
    android:paddingBottom="@dimen/activity_vertical_margin"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    tools:context="com.example.gameboard.MainActivity">

    <com.example.gameboard.GameBoardView
        android:layout_width="match_parent"
        android:layout_height="wrap_content" />
</RelativeLayout>

/res/layout-land/activity_main.xml:

注意match_parentwrap_content的宽度和高度都已切换。

<?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"
    android:paddingBottom="@dimen/activity_vertical_margin"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    tools:context="com.example.gameboard.MainActivity">

    <com.example.gameboard.GameBoardView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_centerHorizontal="true" />
</RelativeLayout>

GameBoardView.java:

public class GameBoardView extends View {

    private Paint mPaint;

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

    public GameBoardView(Context context, AttributeSet attrs) {
        super(context, attrs);
    }

    public GameBoardView(Context context, AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);
    }

    @TargetApi(Build.VERSION_CODES.LOLLIPOP)
    public GameBoardView(Context context, AttributeSet attrs, int defStyleAttr, int defStyleRes) {
        super(context, attrs, defStyleAttr, defStyleRes);
    }

    @Override
    protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {

        int width = MeasureSpec.getSize(widthMeasureSpec);
        int height = MeasureSpec.getSize(heightMeasureSpec);
        int size = Math.min(width, height);
        int sizeMeasureSpec = MeasureSpec.makeMeasureSpec(size, MeasureSpec.EXACTLY);

        super.onMeasure(sizeMeasureSpec, sizeMeasureSpec);

        mPaint = new Paint();
    }

    @Override
    protected void onDraw(Canvas canvas) {
        super.onDraw(canvas);

        int w = getWidth() / 8;
        int h = getHeight() / 8;

        for (int row = 0; row < 8; row++) {
            for (int col = 0; col < 8; col++) {
                // choose black or white depending on the square
                mPaint.setColor((row + col) % 2 == 0 ? 0xFFFFFFFF : 0xFF000000);
                canvas.drawRect(w * col, h * row, w * (col + 1), h * (row + 1), mPaint);
            }
        }
    }
}

这里我只是在视图中绘制正方形。现在,如果我正在制作国际象棋游戏,我还会创建一个Drawable子类,它将采用游戏模型并渲染它。使用单独的Drawable来渲染游戏可以轻松扩展到正确的大小。例如,您的Drawable可以以固定的常量大小呈现,然后由View子类进行缩放以适合。 View子类主要用作控制器,解释触摸事件和更新游戏模型。