线性布局为什么会留下太多的空白空间？

Question

我正在编写一款帮助小孩学习数学的安卓应用。它会给用户一些问题，用户需要回答。如果他/她全部回答正确，就会得到一个奖品。现在我需要在ResultsActivity中告诉用户这个消息。以下是它的样子：

<LinearLayout 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:paddingLeft="@dimen/activity_horizontal_margin"
                android:paddingRight="@dimen/activity_horizontal_margin"
                android:paddingTop="@dimen/activity_vertical_margin"
                android:paddingBottom="@dimen/activity_vertical_margin"
                android:orientation="horizontal"
                tools:context="com.smartkidslovemaths.ResultsActivity">

    <LinearLayout
        android:layout_width="0dp"
        android:layout_height="match_parent"
        android:layout_weight="1"
        android:id="@+id/left_side"
        android:orientation="vertical"
        android:gravity="center">

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="@string/score_label"
            android:textSize="@dimen/score_label_size"/>
        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="100"
            android:id="@+id/score_value"
            android:textSize="@dimen/score_size"/>
    </LinearLayout>

    <View
        android:layout_width="1dp"
        android:layout_height="match_parent"
        android:background="#FF0000FF" />

    <ScrollView
        android:layout_width="0dp"
        android:layout_height="match_parent"
        android:layout_weight="1">
        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:id="@+id/right_side"
            android:layout_margin="@dimen/question_display_margin"
            android:orientation="vertical">

        </LinearLayout>
    </ScrollView>

</LinearLayout>

如您所见，屏幕左侧用于显示分数。右侧（id为right_side的LinearLayout）为空，因为它将根据用户是否正确回答所有问题而有不同的内容。如果他/她没有回答正确，它将显示哪些问题回答错误。这意味着我需要动态地向LinearLayout添加视图。经过几次尝试，我能够显示用户获得的奖励和一些文字告诉他/她。然而，在文本和ImageView之间有很多空白！以下是一个屏幕截图：

希望您不介意这是中文。正如您所看到的，星星尖端和文字之间有很多空间。（我甚至需要向下滚动一点才能看到星星！）现在这里是我添加视图的代码：

private void displayPrize () { //This is called in the onCreate() method
    Resources res = getResources ();
    int marginAll = (int)res.getDimension (R.dimen.prize_display_margin);
    FrameLayout.LayoutParams parentParams = new FrameLayout.LayoutParams (FrameLayout.LayoutParams.MATCH_PARENT, FrameLayout.LayoutParams.WRAP_CONTENT);
    parentParams.setMargins (marginAll, marginAll, marginAll, marginAll);
    ((LinearLayout)findViewById (R.id.right_side)).setLayoutParams (parentParams);

    TextView text = new TextView (this);
    final LinearLayout.LayoutParams textParams =
            new LinearLayout.LayoutParams (
                    ViewGroup.LayoutParams.WRAP_CONTENT, ViewGroup.LayoutParams.WRAP_CONTENT
            );

    final LinearLayout.LayoutParams imageParams =
            new LinearLayout.LayoutParams (
                    ViewGroup.LayoutParams.MATCH_PARENT, ViewGroup.LayoutParams.WRAP_CONTENT
            );
    text.setLayoutParams (textParams);
    QuestionOptions options = QuestionsActivity.Options.getOptions ();

    switch (options.getDigitCount ()) {
        case 1:
        default:
            text.setText (res.getText (R.string.earn_star_text));
            break;
        case 2:
            text.setText (res.getText (R.string.earn_badge_text));
            break;
        case 3:
            text.setText (res.getText (R.string.earn_trophy_text));
            break;
    }

    text.setTextSize (res.getDimension (R.dimen.answer_text_size) / 1.5F);

    ((LinearLayout)findViewById (R.id.right_side)).addView (text);

    ImageView image = new ImageView (this);
    image.setLayoutParams (imageParams);
    int resID = QuestionOptionMaps.getOptionsDrawableMap ().get (options);
    image.setImageResource (resID);
    ((LinearLayout)findViewById (R.id.right_side)).addView (image);
}

我尝试了很多次通过更改那些wrap_content和match_parent的属性，但每次都没有成功。我甚至尝试给视图添加权重！而且我确定图片是一个完美的正方形，所以白色空间不是由于图片引起的。

为了清晰起见，这里是dimens.xml和strings.xml。

<resources>
    <dimen name="activity_horizontal_margin">16dp</dimen>
    <dimen name="activity_vertical_margin">16dp</dimen>
    <dimen name="question_margin">25dp</dimen>

    <dimen name="customize_menu_title">15pt</dimen>
    <dimen name="customize_menu_radio">13pt</dimen>
    <dimen name="question_text_size">20pt</dimen>
    <dimen name="answer_text_size">12pt</dimen>

    <dimen name="radio_button_spacing">20dp</dimen>
    <dimen name="item_spacing">20dp</dimen>

    <dimen name="score_label_size">20pt</dimen>
    <dimen name="score_size">40pt</dimen>
    <dimen name="question_display_margin">4dp</dimen>
    <dimen name="prize_display_margin">32dp</dimen>
</resources>

<resources>
    <string name="app_name">Smart Kids Love Maths</string>

    <string name="button_trophies">My Prizes</string>
    <string name="button_start">Start!</string>

    <string name="digit_text">Number of digits</string>
    <string name="operator_text">Operation</string>
    <string name="timer_enabled_text">Timer Enabled</string>
    <string name="title_activity_questions">Smart Kids Love Maths</string>

    <string name="title_activity_results">Results</string>
    <string name="score_label">Your Score:</string>

    <string name="correct_text">Correct!</string>
    <string name="wrong_text">Wrong!</string>
    <string name="correct_answer_text">Correct Answer: </string>
    <string name="earn_trophy_text">You earned a new trophy!</string>
    <string name="earn_badge_text">You earned a new badge!</string>
    <string name="earn_star_text">You earned a new star!</string>
</resources>

你能告诉我为什么会发生这种情况，以及如何解决吗？

- Sweeper

---

你尝试过在两个维度中将imageParams更改为WRAP_CONTENT吗？ - Paulo Avelar

@PauloAvelar 因为这张图片有点大，我认为将其放大到实际大小会更好，对吧？ - Sweeper

@PauloAvelar 现在我已经尝试了，仍然是空白空间。 - Sweeper

是的，我建议您稍后在项目中调整大小。您不能将其添加到XML布局中作为“不可见”，然后在显示之前设置文本和图像源吗？这将帮助您设计和预览最终布局。 - Paulo Avelar

这不是LinearLayout的问题。你需要为大的ImageView调用“setAdjustViewBounds(true)”。 - wrkwrk

Answer 1

如果imageView比其父容器大，使用imageView.setAdjustViewBounds(true)来保持其大小比例。您可以看到附加图像之间的差异。

    LinearLayout linear = (LinearLayout) findViewById(R.id.left);
    TextView textView = new TextView(this);
    textView.setText("Test Right 1");
    textView.setTextSize(32);
    LinearLayout.LayoutParams tParams = new LinearLayout.LayoutParams(
            ViewGroup.LayoutParams.MATCH_PARENT, ViewGroup.LayoutParams.WRAP_CONTENT);
    linear.addView(textView, tParams);

    ImageView imageView = new ImageView(this);
    imageView.setImageResource(R.mipmap.img);
    imageView.setAdjustViewBounds(true); // This is the trick
    LinearLayout.LayoutParams iParams = new LinearLayout.LayoutParams(
            ViewGroup.LayoutParams.MATCH_PARENT, ViewGroup.LayoutParams.WRAP_CONTENT);
    linear.addView(imageView, iParams);

- wrkwrk