如何将ScrollView与动态LinearLayout一起使用?

时间:2018-04-22 18:13:28

标签: android android-linearlayout android-scrollview

我正在尝试创建一个包含多个项目的Activity,其中一个是在运行时使用其他视图填充的LinearLayout。

我的活动XML用于此目的如下:

<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    tools:context="com.ibosca.thub.QuestionResultsActivity">

    <ScrollView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:fillViewport="true">

        <android.support.constraint.ConstraintLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content">

            <ImageView
                android:id="@+id/questionIcon"
                android:layout_width="80dp"
                android:layout_height="80dp"
                android:layout_marginBottom="8dp"
                android:layout_marginEnd="8dp"
                android:layout_marginStart="8dp"
                android:layout_marginTop="8dp"
                android:src="@drawable/ic_help_black_24dp"
                android:tint="@android:color/holo_orange_dark"
                app:layout_constraintBottom_toBottomOf="parent"
                app:layout_constraintEnd_toEndOf="parent"
                app:layout_constraintStart_toStartOf="parent"
                app:layout_constraintTop_toTopOf="parent"
                app:layout_constraintVertical_bias="0.0" />

            <TextView
                android:id="@+id/questionText"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginBottom="8dp"
                android:layout_marginEnd="8dp"
                android:layout_marginStart="8dp"
                android:layout_marginTop="8dp"
                android:gravity="center"
                android:paddingBottom="8dp"
                android:textColor="@android:color/black"
                android:textSize="20sp"
                android:textStyle="bold"
                app:layout_constraintBottom_toBottomOf="parent"
                app:layout_constraintEnd_toEndOf="parent"
                app:layout_constraintStart_toStartOf="parent"
                app:layout_constraintTop_toBottomOf="@id/questionIcon"
                app:layout_constraintVertical_bias="0.02" />

            <android.support.v7.widget.LinearLayoutCompat
                android:id="@+id/responses"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:orientation="vertical"
                app:layout_constraintTop_toBottomOf="@id/questionText"
                app:layout_constraintVertical_bias="0.0" />

        </android.support.constraint.ConstraintLayout>

    </ScrollView>


</android.support.constraint.ConstraintLayout>

我正在使用此Java代码填充回复LinearLayoutCompat

    LinearLayoutCompat rootLayout = findViewById(R.id.responses);

    ArrayList<Response> orderedresponses = question.getOrderedResponses();

    for (int i = 0; i < orderedresponses.size(); i++){

        currentResponse = orderedresponses.get(i);

        if(i == 0){
            nextResponse = orderedresponses.get(i+1);
        }

        View child = getLayoutInflater().inflate(R.layout.response, null);

        TextView responseText = child.findViewById(R.id.responseText);
        TextView votesText = child.findViewById(R.id.votesText);

        responseText.setText(currentResponse.getText());
        String votesInfo = getResources().getString(R.string.votesPercentQuestionResult, Integer.toString(currentResponse.getVotes()) , Float.toString(currentResponse.getPercentVote()));
        //votesText.setText(currentResponse.getVotes() + " vots · " + currentResponse.getPercentVote() +"%");
        votesText.setText(votesInfo);

        if(i == 0 && currentResponse.getVotes() != 0 && nextResponse.getVotes() < currentResponse.getVotes()){
            //Set star icon
            ImageView icon = child.findViewById(R.id.icon);
            icon.setImageDrawable(getResources().getDrawable(R.drawable.ic_stars_black_24dp));

        }

        rootLayout.addView(child);

    }

而且,最后一段代码中使用的Response XML看起来像是:

<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:background="?android:attr/selectableItemBackground"
    android:clickable="true"
    android:focusable="true"
    android:orientation="vertical"
    android:paddingLeft="10dp"
    android:paddingRight="10dp">

    <ImageView xmlns:app="http://schemas.android.com/apk/res-auto"
        android:id="@+id/icon"
        android:layout_width="35dp"
        android:layout_height="35dp"
        android:layout_marginBottom="8dp"
        android:layout_marginEnd="8dp"
        android:layout_marginStart="8dp"
        android:layout_marginTop="8dp"
        android:src="@drawable/ic_insert_comment_black_24dp"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintHorizontal_bias="0.0"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent" />

    <TextView
        android:id="@+id/responseText"
        android:layout_width="0dp"
        android:layout_height="23dp"
        android:layout_marginEnd="8dp"
        android:layout_marginStart="8dp"
        android:layout_weight=".90"
        android:ellipsize="end"
        android:maxLines="1"
        android:paddingLeft="5dp"
        android:paddingRight="5dp"
        android:singleLine="true"
        android:textColor="@android:color/black"
        android:textSize="15sp"
        android:textStyle="bold"
        app:layout_constraintBottom_toBottomOf="@+id/icon"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintHorizontal_bias="0.0"
        app:layout_constraintStart_toEndOf="@+id/icon"
        app:layout_constraintTop_toTopOf="parent" />

    <TextView
        android:id="@+id/votesText"
        android:layout_width="0dp"
        android:layout_height="23dp"
        android:layout_marginEnd="8dp"
        android:layout_marginStart="8dp"
        android:layout_weight=".90"
        android:ellipsize="end"
        android:maxLines="1"
        android:paddingLeft="5dp"
        android:paddingRight="5dp"
        android:singleLine="true"
        android:textSize="15sp"
        app:layout_constraintBottom_toBottomOf="@+id/icon"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintHorizontal_bias="0.0"
        app:layout_constraintStart_toEndOf="@+id/icon"
        app:layout_constraintTop_toBottomOf="@id/responseText" />

</android.support.constraint.ConstraintLayout>

问题:

在我的尝试中,我意识到在Response的LinearLayoutCompat之后有一个空白的额外空间,这导致在不需要实际滚动时滚动。

我无法弄清楚这个空间来自哪里,但似乎这个空白区域随着响应LinearLayout而增长,所以当响应线性布局内的内容很小时,空白空间很小,随着它的增长,空白也在增长。

我的目标是删除这个额外的空白区域,并仅在需要时使用滚动视图,也就是说,当线性布局比屏幕大小更大时。

我该如何解决?

编辑:问题的清晰度

View fits perfectly on the screen, no extra space needed

Blank space before last element of the linear layout

正如您在第一个屏幕截图中看到的那样,内容适合屏幕,但是android在线性布局的底部添加了额外的空间,从而导致了一个奇怪的空白区域。

3 个答案:

答案 0 :(得分:0)

在.xml文件中编辑或删除这些行,您的问题就会解决:

            android:layout_marginBottom="8dp"
            android:layout_marginEnd="8dp"
            android:layout_marginStart="8dp"
            android:layout_marginTop="8dp"

答案 1 :(得分:0)

你需要:

  1. 更改根布局中interface State { someProperty: string; } class MakeMeSafer extends React.Component<{}, State> { state: State = { someProperty: '' } onChange = (name: keyof State) => (e: React.FormEvent<HTMLInputElement>) => { const newValue = e.currentTarget.value; this.setState({name: newValue}); } } render(): JSX.Element { return ( <div> <input type="text" onChange={this.onChange('some-name-not-in-state')} /> </div> ); } } 的{​​{1}}
  2. 在ScrollView中更改android:layout_height="wrap_content"的{​​{1}}
  3. android:layout_height="match_parent"添加到您的LinearLayoutCompat
  4. 这是代码

    android:layout_height="wrap_content"

答案 2 :(得分:0)

最后,我自己解决了问题。

我使用Android Studio布局检查器来确切地看到我的布局中的哪一块占用了比所需更多的空间。您可以在文档中找到更多信息:https://developer.android.com/studio/debug/layout-inspector.html#open_the_layout_inspector

问题出现在constraintLayout上,所以我尝试将约束布局更改为linearLayout,这解决了这个问题。

这是最终代码:

&#13;
&#13;
<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context="com.ibosca.thub.QuestionResultsActivity">

    <ScrollView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:fillViewport="true">

        <android.support.v7.widget.LinearLayoutCompat
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:orientation="vertical">

            <ImageView
                android:id="@+id/questionIcon"
                android:layout_width="80dp"
                android:layout_height="80dp"
                android:layout_marginBottom="8dp"
                android:layout_marginEnd="8dp"
                android:layout_marginStart="8dp"
                android:layout_marginTop="8dp"
                android:layout_gravity="center"
                android:src="@drawable/ic_help_black_24dp"
                android:tint="@android:color/holo_orange_dark"
                app:layout_constraintBottom_toBottomOf="parent"
                app:layout_constraintEnd_toEndOf="parent"
                app:layout_constraintStart_toStartOf="parent"
                app:layout_constraintTop_toTopOf="parent"
                app:layout_constraintVertical_bias="0.0" />

            <TextView
                android:id="@+id/questionText"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginBottom="8dp"
                android:layout_marginEnd="8dp"
                android:layout_marginStart="8dp"
                android:layout_marginTop="8dp"
                android:gravity="center"
                android:paddingBottom="8dp"
                android:textColor="@android:color/black"
                android:textSize="20sp"
                android:textStyle="bold"
                app:layout_constraintBottom_toBottomOf="parent"
                app:layout_constraintEnd_toEndOf="parent"
                app:layout_constraintStart_toStartOf="parent"
                app:layout_constraintTop_toBottomOf="@id/questionIcon"
                app:layout_constraintVertical_bias="0.02" />

            <android.support.v7.widget.LinearLayoutCompat
                android:id="@+id/responses"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:orientation="vertical"
                app:layout_constraintBottom_toBottomOf="parent"
                app:layout_constraintTop_toBottomOf="@id/questionText"
                app:layout_constraintVertical_bias="0.0" />

        </android.support.v7.widget.LinearLayoutCompat>

    </ScrollView>


</android.support.constraint.ConstraintLayout>
&#13;
&#13;
&#13;

希望这可以帮助其他有类似问题的人!