Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Divide the screen into SurfaceView and xml layout

MyActivity has setContentView(MySurfaceView) that covers all the screen.

I would like to divide the screen into two parts: the first 2/3 of the screen must be occupied by MySurfaceView and the last 1/3 by my_activity_layout.xml.

How can I do that? Thanks.

enter image description here

EDIT

Thanks for your answers, but I don't have how to apply them in my case. To be clear, these are my objects:

enter image description here

enter image description here

like image 229
Stefano Avatar asked Nov 01 '18 18:11

Stefano


1 Answers

Solution:

To attach an xml file in your layout, you can make use of the <include> tag.

Reusing layouts is particularly powerful as it allows you create reusable complex layouts. For example, a yes/no button panel, or custom progress bar with description text. More

You can have a functionality as shown in the question with the help of ConstraintLayout. Of course, there are solutions using the legacy <LinearLayout> with something called as weights but as the warning says Weights are bad for performance.

Why weights are bad for performance?

Layout weights require a widget to be measured twice. When a LinearLayout with non-zero weights is nested inside another LinearLayout with non-zero weights, then the number of measurements increase exponentially.

So let's get on to the solution using <ConstraintLayout>.

Let's say we have a layout file called my_activity_layout.xml and we use the below code to achieve what we want:

<?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=".MainActivity">

    <SurfaceView
        android:layout_width="0dp"
        android:layout_height="0dp"
        app:layout_constraintBottom_toTopOf="@+id/guideline"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent" />

    <android.support.constraint.Guideline
        android:id="@+id/guideline"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:orientation="horizontal"
        app:layout_constraintGuide_percent="0.67" />

    <include
        android:id="@+id/news_title"
        layout="@layout/my_activity_layout"
        android:layout_width="0dp"
        android:layout_height="0dp"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="@+id/guideline" />

</android.support.constraint.ConstraintLayout>

As you can see the Guideline help us to get 2/3 i.e 66.666 ~ 67 % of the screen, and then you can constraint your SurfaceView and your layout using <include> tag on your activity.

You can also see the required result:

Desired Result

You can just copy-paste the solution and see if it works as expected.

like image 83
Ümañg ßürmån Avatar answered Sep 27 '22 22:09

Ümañg ßürmån