DisplaySettings: overlap of group label and spinner in french

[NobleMathews]

In the video display settings, the "Group by" textView and Spinner overlap

[mayil-ai[bot]]

• Open the layout XML file(s) associated with the video display settings where the "Group by" textView and Spinner are defined.
• Modify the layout to use ConstraintLayout or adjust the layout parameters to accommodate longer text strings. For example, if using LinearLayout, you can use layout_weight to allocate space proportionally:

<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:orientation="horizontal">

    <TextView
        android:id="@+id/group_by_textView"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_weight="1"
        android:text="@string/group_by" />

    <Spinner
        android:id="@+id/group_by_spinner"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_weight="1" />
</LinearLayout>

• If using ConstraintLayout, ensure that constraints are set to prevent the textView and Spinner from overlapping. For example:

<androidx.constraintlayout.widget.ConstraintLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content">

    <TextView
        android:id="@+id/group_by_textView"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintEnd_toStartOf="@id/group_by_spinner"
        app:layout_constraintTop_toTopOf="parent"
        android:text="@string/group_by" />

    <Spinner
        android:id="@+id/group_by_spinner"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        app:layout_constraintStart_toEndOf="@id/group_by_textView"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintTop_toTopOf="@id/group_by_textView" />
</androidx.constraintlayout.widget.ConstraintLayout>

• Review the French translations in the values-fr/strings.xml file for the "Group by" text. If necessary, shorten the translation to prevent UI issues while maintaining the meaning:

<string name="group_by">Trier par</string>

• Test the changes by setting the application language to French and verifying that the "Group by" textView and Spinner no longer overlap.
• If the problem is not resolved, consider adding a ScrollView to the settings layout or dynamically adjusting the text size based on the device's screen size and resolution to ensure proper display of the UI elements.

Here are some code snippets that may help you get started:

• application/television/src/main/java/org/videolan/television/ui/preferences/PreferencesVideo.kt:41-79 | Snippet contains preferences related to video settings, potentially including 'Group by' textView and Spinner.

• application/vlc-android/src/org/videolan/vlc/gui/preferences/PreferencesSubtitles.kt:1-42 | The snippet indicates the location of a Kotlin file that might handle video display settings, which could be relevant for adjusting layout parameters or reviewing localization issues.

💡 To rerun Mayil, comment mayil-ai rerun. Mayil will incorporate any new context added to the ticket. Include details in your rerun comment to guide Mayil!