Android: How to layout buttons along right/left edge of screen, when in landscape mode

631 views Asked by At

My application is intended to be used in portrait mode. The application itself is locked in landscape mode (in the manifest) because I am working with an OpenCV JavaCameraView.

I would like to position a row of buttons along the bottom edge of the screen (as the user sees it). This is the right-hand side of the screen, as the phone sees it. I've tried using a LinearLayout and playing around with the gravity settings, but this orientates the buttons so that the text is facing according to the landscape orientation; e.g. when the phone is held in portrait mode (as intended), the text is orientated so that the bottom of the text is pointing left (because it has been told it is in landscape mode).

Is there any way I can make the buttons and the LinearLayout ignore the portrait/landscape settings and force them to behave as I would like?

This is my current .xml file for the activity:

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
xmlns:opencv="http://schemas.android.com/apk/res-auto"
android:layout_width="fill_parent"
android:layout_height="fill_parent" >

<org.opencv.android.JavaCameraView
    android:id="@+id/main_activity_surface_view"

    android:layout_width="fill_parent"
    android:layout_height="fill_parent" />

<ImageView
    android:id="@+id/recordingIconImageView"

    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_alignParentTop="true"
    android:layout_alignParentLeft="true"


    android:src="@drawable/circle_red"
    android:visibility="invisible" />

    <TextView
        android:id="@+id/movement"

        android:rotation="270"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"

        android:layout_alignParentBottom="true"
        android:layout_alignParentLeft="true"
        android:layout_alignParentStart="true"

        android:text=""
        android:textSize="20sp"
        android:textStyle="bold"
        android:textColor="#FF0000" />


<LinearLayout
    android:id="@+id/button_row_linear_layout"

    android:layout_width="wrap_content"
    android:layout_height="fill_parent"
    android:layout_alignParentEnd="true"
    android:layout_alignParentRight="true"

    android:orientation="vertical" >

    <Button
        android:id="@+id/button_retry"

        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:rotation="270"
        android:layout_weight="1"

        android:onClick="captureButtonPressed"
        android:text="Retry" />

    <Button
        android:id="@+id/button_start"

        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:rotation="270"
        android:layout_weight="1"

        android:onClick="captureButtonPressed"
        android:text="Start" />

    <Button
        android:id="@+id/button_next"

        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:rotation="270"
        android:layout_weight="1"

        android:onClick="captureButtonPressed"
        android:text="Next" />
</LinearLayout>
</RelativeLayout>

***Edit: Adding images to clarify (as suggested in comments) and have already switched to relative layout on my own, so the .xml is also updated. Image of current state:

Screenshot

As you can see I've got the buttons where I would like them (used android:rotation="270"). Two issues now:

1) The text of the TextView is clipped offscreen. I'm pretty sure this is because the sizing constraints are calculated as if it is not rotated and only after layout occurs is it rotated (this is a guess, but it does appear as if that is what's happening)

2) I can't seem to get the buttons to expand to take up available space inside the linear layout.

Any suggestions would be very welcome!

Cheers.

0

There are 0 answers