Question

这是我一直在尝试实现的用户界面：

方形框1,2,3实际上表示三个按钮/可单击的段。方形框4表示框架布局，该框架布局将根据单击方形框（1或2或3）中的哪一个而被片段替换。因此，有效地，我有三个片段。我使用ConstraintLayout设计了片段，因为我希望它具有响应性和更优雅的外观。

以下是示例片段之一的样子：

以下是所使用片段的源代码：

<?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">

    <TextView
        android:id="@+id/textView"
        android:layout_width="0dp"
        android:layout_height="0dp"
        android:layout_marginBottom="206dp"
        android:background="#BC000000"
        android:gravity="center_vertical"
        android:text="@string/itin1header"
        android:textColor="#FFFFFF"
        app:layout_constraintBottom_toTopOf="@+id/textView17"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent" />

    <TextView
        android:id="@+id/textView7"
        android:layout_width="159dp"
        android:layout_height="0dp"
        android:layout_marginBottom="666dp"
        android:text="@string/itin1date"
        android:textColor="#000000"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintStart_toStartOf="@+id/textView"
        app:layout_constraintTop_toBottomOf="@+id/textView" />

    <ImageView
        android:id="@+id/imageView2"
        android:layout_width="99dp"
        android:layout_height="90dp"
        android:layout_marginEnd="60dp"
        android:layout_marginRight="60dp"
        app:layout_constraintEnd_toEndOf="@+id/textView7"
        app:layout_constraintTop_toBottomOf="@+id/textView7"
        app:srcCompat="@drawable/itinimg" />

    <TextView
        android:id="@+id/textView8"
        android:layout_width="115dp"
        android:layout_height="28dp"
        android:layout_marginBottom="60dp"
        android:text="@string/itin1status"
        android:textColor="#4CAF50"
        android:textSize="18sp"
        android:textStyle="bold"
        app:layout_constraintBottom_toBottomOf="@+id/imageView2"
        app:layout_constraintStart_toEndOf="@+id/imageView2" />

    <TextView
        android:id="@+id/textView9"
        android:layout_width="170dp"
        android:layout_height="37dp"
        android:text="@string/itin1travelsrcdest"
        android:textSize="24sp"
        android:textStyle="bold"
        app:layout_constraintStart_toEndOf="@+id/imageView2"
        app:layout_constraintTop_toBottomOf="@+id/textView8" />

    <TextView
        android:id="@+id/textView10"
        android:layout_width="169dp"
        android:layout_height="22dp"
        android:text="@string/itin1airlines"
        android:textStyle="bold"
        app:layout_constraintStart_toStartOf="@+id/textView9"
        app:layout_constraintTop_toBottomOf="@+id/textView9" />

    <TextView
        android:id="@+id/textView11"
        android:layout_width="0dp"
        android:layout_height="21dp"
        android:layout_marginStart="16dp"
        android:layout_marginLeft="16dp"
        android:layout_marginTop="16dp"
        android:layout_marginEnd="61dp"
        android:layout_marginRight="61dp"
        android:text="@string/itincommonDepart"
        app:layout_constraintEnd_toStartOf="@+id/textView12"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/imageView2" />

    <TextView
        android:id="@+id/textView12"
        android:layout_width="85dp"
        android:layout_height="22dp"
        android:layout_marginTop="12dp"
        android:layout_marginEnd="59dp"
        android:layout_marginRight="59dp"
        android:text="@string/itincommonArrival"
        app:layout_constraintEnd_toStartOf="@+id/textView13"
        app:layout_constraintStart_toEndOf="@+id/textView11"
        app:layout_constraintTop_toBottomOf="@+id/imageView2" />

    <TextView
        android:id="@+id/textView13"
        android:layout_width="65dp"
        android:layout_height="22dp"
        android:layout_marginTop="12dp"
        android:layout_marginEnd="52dp"
        android:layout_marginRight="52dp"
        android:text="@string/itincommonDuration"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toEndOf="@+id/textView12"
        app:layout_constraintTop_toBottomOf="@+id/imageView2" />

    <TextView
        android:id="@+id/textView14"
        android:layout_width="89dp"
        android:layout_height="0dp"
        android:layout_marginBottom="520dp"
        android:text="@string/itincommonDepartAns"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintStart_toStartOf="@+id/textView11" />

    <TextView
        android:id="@+id/textView15"
        android:layout_width="100dp"
        android:layout_height="22dp"
        android:text="@string/itincommonArrivalAns"
        app:layout_constraintStart_toStartOf="@+id/textView12"
        app:layout_constraintTop_toBottomOf="@+id/textView12" />

    <TextView
        android:id="@+id/textView16"
        android:layout_width="101dp"
        android:layout_height="21dp"
        android:text="@string/itincommonDurationAns"
        app:layout_constraintStart_toStartOf="@+id/textView13"
        app:layout_constraintTop_toBottomOf="@+id/textView13" />

    <TextView
        android:id="@+id/textView17"
        android:layout_width="91dp"
        android:layout_height="21dp"
        android:layout_marginStart="16dp"
        android:layout_marginLeft="16dp"
        android:layout_marginBottom="472dp"
        android:text="@string/itincommonConfirmation"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/textView" />

    <TextView
        android:id="@+id/textView18"
        android:layout_width="102dp"
        android:layout_height="20dp"
        android:layout_marginTop="24dp"
        android:text="@string/itincommonTerminal"
        app:layout_constraintStart_toStartOf="@+id/textView12"
        app:layout_constraintTop_toBottomOf="@+id/textView15" />

    <TextView
        android:id="@+id/textView19"
        android:layout_width="81dp"
        android:layout_height="20dp"
        android:layout_marginTop="28dp"
        android:text="@string/itincommonSeat"
        app:layout_constraintStart_toStartOf="@+id/textView13"
        app:layout_constraintTop_toBottomOf="@+id/textView16" />

    <TextView
        android:id="@+id/textView20"
        android:layout_width="114dp"
        android:layout_height="20dp"
        android:text="@string/itincommonConfirmationAns"
        app:layout_constraintStart_toStartOf="@+id/textView17"
        app:layout_constraintTop_toBottomOf="@+id/textView17" />

    <TextView
        android:id="@+id/textView21"
        android:layout_width="114dp"
        android:layout_height="21dp"
        android:text="@string/itincommonTerminalAns"
        app:layout_constraintStart_toStartOf="@+id/textView18"
        app:layout_constraintTop_toBottomOf="@+id/textView18" />

    <TextView
        android:id="@+id/textView22"
        android:layout_width="105dp"
        android:layout_height="18dp"
        android:text="@string/itincommonSeatAns"
        app:layout_constraintStart_toStartOf="@+id/textView19"
        app:layout_constraintTop_toBottomOf="@+id/textView19" />
</android.support.constraint.ConstraintLayout>

这是活动类别：

public class ItineraryDashBoardActivity extends AppCompatActivity {
@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_itinerary_dashboard);

    Button itin1Button = (Button) findViewById(R.id.button);
    itin1Button.setOnClickListener(new View.OnClickListener() {
        @Override
        public void onClick(View v) {
            loadFragment(new ItinFragmentOne());
        }
    });

    Button itin2Button = (Button) findViewById(R.id.button2);
    itin2Button.setOnClickListener(new View.OnClickListener() {
        @Override
        public void onClick(View v) {
            loadFragment(new ItinFragmentTwo());
        }
    });

}

private void loadFragment(Fragment fragment) {
    // create a FragmentManager

    FragmentManager fm = getSupportFragmentManager();
    // create a FragmentTransaction to begin the transaction and replace the Fragment
    FragmentTransaction fragmentTransaction = fm.beginTransaction();
    // replace the FrameLayout with new Fragment
    fragmentTransaction.replace(R.id.consLayout, fragment);
    fragmentTransaction.commit(); // save the changes
}
}

这是主要布局：

<?xml version="1.0" encoding="utf-8"?>

<Button
    android:id="@+id/button3"
    android:layout_width="302dp"
    android:layout_height="63dp"
    android:layout_marginStart="8dp"
    android:layout_marginLeft="8dp"
    android:layout_marginTop="468dp"
    android:layout_marginEnd="8dp"
    android:layout_marginRight="8dp"
    android:text="@string/social_influencer_promo"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintHorizontal_bias="0.655"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintTop_toTopOf="parent" />

<Button
    android:id="@+id/button"
    android:layout_width="111dp"
    android:layout_height="76dp"
    android:layout_marginStart="8dp"
    android:layout_marginLeft="8dp"
    android:layout_marginTop="123dp"
    android:layout_marginEnd="8dp"
    android:layout_marginRight="8dp"
    android:layout_marginBottom="20dp"
    android:text="@string/Itin1"
    app:layout_constraintBottom_toTopOf="@+id/button2"
    app:layout_constraintEnd_toStartOf="@+id/consLayout"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintTop_toTopOf="parent" />

<Button
    android:id="@+id/button2"
    android:layout_width="110dp"
    android:layout_height="67dp"
    android:layout_marginStart="8dp"
    android:layout_marginLeft="8dp"
    android:layout_marginEnd="12dp"
    android:layout_marginRight="12dp"
    android:layout_marginBottom="426dp"
    android:text="@string/Itin2"
    app:layout_constraintBottom_toBottomOf="parent"
    app:layout_constraintEnd_toStartOf="@+id/consLayout"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintTop_toBottomOf="@+id/button" />

<FrameLayout
    android:id="@+id/consLayout"
    android:layout_width="253dp"
    android:layout_height="0dp"
    android:layout_marginEnd="16dp"
    android:layout_marginRight="16dp"
    android:layout_marginBottom="382dp"
    app:layout_constraintBottom_toBottomOf="parent"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintStart_toEndOf="@+id/button2"
    app:layout_constraintTop_toBottomOf="@+id/textView6">

</FrameLayout>

<TextView
    android:id="@+id/textView6"
    android:layout_width="239dp"
    android:layout_height="50dp"
    android:layout_marginStart="53dp"
    android:layout_marginLeft="53dp"
    android:layout_marginTop="16dp"
    android:layout_marginEnd="65dp"
    android:layout_marginRight="65dp"
    android:layout_marginBottom="16dp"
    android:gravity="center"
    android:text="@string/itinsummary"
    android:textStyle="bold"
    app:layout_constraintBottom_toTopOf="@+id/consLayout"
    app:layout_constraintEnd_toEndOf="@+id/consLayout"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintTop_toTopOf="parent" />

现在，如果我单击上面提到的一个方形框（1/2/3），则片段内容根本不会显示在方形框4中。

你能告诉我这里出了什么问题吗？我想念什么吗？非常感谢您的建议。谢谢！

如何将Fragment添加为ConstraintLayout？

0 个答案: