如何使我的玩具机器人计算器UI与设备屏幕适合 [英] How to make my toy android calculator UI fits with the device screen

问题描述

我想创建一个简单的计算器是我的第一个Android项目（而不是exploded）目录中，calculaotr用户界面如下图所示，这是我使用网​​格布局来安排的结果显示的TextView 和控制按钮 s时，网​​格布局需要6行4列。 （我这里简化了XML布局文件）

I want to create a simple calculator as my first android project (instead of Helloworld), the calculaotr UI is shown below, which I uses GridLayout to arrange the result display TextView and the control Buttons, the GridLayout takes 6 rows and 4 columns. ( I simplified the xml layout file here)

<GridLayout android:rowCount="6" 
            android:columnCount="4"
            android:orientation="horizontal">
    <TextView android:id="@+id/expressionTextView"
              android:layout_columnSpan="4"/>
    <LinearLayout
              android:layout_columnSpan="4">
        <Button android:id="@+id/btnClearText"/>
        <Button android:id="@+id/btnDeleteText"/>
    </LinearLayout>
 <GridLayout>

有关创建 + / - / X // 0-9 按钮，我用下面的code：

For creating the +/-/x//0-9. buttons, I use the following code:

String[] buttonTexts = new String[] 
{
    "7", "8", "9", "/",
    "4", "5", "6", "x",
    "1", "2", "3", "-",
    ".", "0", "=", "+"
};

@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_main);

    Point size = new Point();
    getWindowManager().getDefaultDisplay().getSize(size);
    int screenWidth = size.x;
    int screenHeight = size.y;
    int oneQuarterWidth = (int) (screenWidth * 0.25);

    for (int ii = 0; ii < buttonTexts.length; ii++) {
        Button btn = new Button(this);
        btn.setText(buttonTexts[ii]);
        btn.setTextSize(40);

        GridLayout.Spec rowSpec = GridLayout.spec(ii/4 + 2);
        GridLayout.Spec columnSpec = GridLayout.spec(ii % 4 );
        GridLayout.LayoutParams params = new GridLayout.LayoutParams(rowSpec, columnSpec);
        params.setGravity(Gravity.FILL);
        params.width = oneQuarterWidth;
        gridLayout.addView(btn, params);
    }

然而，在最后一行延伸在垂直方向和运行我的机器人机器上的计算器时，一些最后一排的可能被隐藏！

However, the last row stretches on the vertical direction, and when running the calculator on my android machine, some of the last row may be hidden!

我要的是使UI与设备高度适合，你有什么想法？谢谢！

What I want is to make the UI fits with the device height, do you have any ideas? Thanks!

P.S。
我甚至想设置结果显示的高度的TextView 和的LinearLayout 包含清除/德尔使用：

P.S. I even tried to set the heights of the result display TextView and LinearLayout that contains Clear/Del by using:

expressionTextView = (TextView)findViewById(R.id.expressionTextView);
clearDelLinearLayout = (LinearLayout)findViewById(R.id.linearLayout1);

GridLayout.LayoutParams expressionTextViewParams =
     (GridLayout.LayoutParams)expressionTextView.getLayoutParams();
expressionTextViewParams.height = ...; // some calculated height
expressionTextView.setLayoutParams(expressionTextViewParams);

但是，这并不工作：​​（

But this doesn't work :(

推荐答案

从文档：

限制：

网格布局不会为原则提供支持
  重量，如以重量定义的。在一般情况下，它是不因此可能
  配置GridLayout的分配多间多余的空间
  组件。一些常见的用例仍可容纳作为
  如下。放置的空间等量周围的成分在细胞中
  组;使用居中对齐（或重力）。对于完全控制
  行或列的剩余空间分布;使用的LinearLayout
  子视图保持组件相关联的小区组中使用。什么时候
  使用这两种技术，记住，细胞群可能
  定义重叠。

GridLayout does not provide support for the principle of weight, as defined in weight. In general, it is not therefore possible to configure a GridLayout to distribute excess space between multiple components. Some common use-cases may nevertheless be accommodated as follows. To place equal amounts of space around a component in a cell group; use CENTER alignment (or gravity). For complete control over excess space distribution in a row or column; use a LinearLayout subview to hold the components in the associated cell group. When using either of these techniques, bear in mind that cell groups may be defined to overlap.

来源

尝试使用LinearLayouts为孩子，如：

try using LinearLayouts for the children, like:

<LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content" android:orientation="horizontal">
<Space
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:layout_weight="1" />
<Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:id="@+id/btnClearText" />

或者你可以简单地使用另一个布局，例如像的LinearLayout ，这是pretty一致的，当涉及到渲染

Or you can simply use another layout, like e.g. LinearLayout, which is pretty consistent when it comes to rendering

P.S。

从文档：

要setLayoutParams（ViewGroup.LayoutParams）必须调用进行
  通知更改网格布局

a call to setLayoutParams(ViewGroup.LayoutParams) must be made to notify GridLayout of the change

也许改变布局参数后，你应该叫 GridLayout.invalidate（）;

Maybe after changing layout parameters, you should call GridLayout.invalidate(); ?

这篇关于如何使我的玩具机器人计算器UI与设备屏幕适合的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！