170822Ago - CHAPTER 5

170822Ago - CHAPTER 5

Hello, today there are good news, the terrorist cell that attacked BCN is completely finished, well for the Mossos!!!

About my app, I found a typical error: The title bar cover other object in the screen, hiding his top area... I always forget this!

To solve it I must simply to use completely the guidelines objects, I used one for a bottom split, now we go to use others for top, left and right guidelines.

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

[...]

Note that if you don't use a let guideline in a constraint layout, the visual designer od Android Studio give you continually a message said something as "There are not left constraint an the object will be moved to 0 coordinates" (not allways, depends of the version of your IDE version)

For example the first <ScrollView> tag will have now these constraints:

    app:layout_constraintTop_toTopOf="@+id/top_guideline"
    app:layout_constraintBottom_toTopOf="@+id/bottom_guideline"
    app:layout_constraintLeft_toRightOf="@+id/left_guideline"
    app:layout_constraintRight_toLeftOf="@+id/right_guideline"

As the TextView and the first ScrollView begins from the top_guideline (at 15% of screen), the title bar don't hide his content.

This space of 15% I will use to show specific options for each main action (Info, Files, etc)

For that I go to design a horizontal panel with buttons and other controls. Each panel or options group can be made it with his own HorizontalScrollView, and we can hide ones and show other.

Our layout file can become very big and complex, to evitate this I go to use diferent layout files, and I'll use the <include layout...=""> tag into main_layout.xml into use it easily.

This is a option_layout.xml provisional file shown by default before the user select an action:

<?xml version="1.0" encoding="utf-8"?>
<HorizontalScrollView
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:visibility="visible"
    android:layout_width="0dp"
    android:layout_height="wrap_content"
    android:keepScreenOn="true"
    android:scrollbarStyle="insideInset"
    android:id="@+id/options_default"
    android:scrollbars=""
    app:layout_constraintBottom_toTopOf="@+id/top_guideline"
    app:layout_constraintLeft_toRightOf="@+id/left_guideline"
    app:layout_constraintRight_toLeftOf="@+id/right_guideline"
    tools:layout_editor_absoluteX="8dp">
    <LinearLayout
        android:orientation="horizontal"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:id="@+id/container_default">

        <TextView
            android:id="@+id/tmp_text"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Select an action with the buttons at the bottom..."
            android:textStyle="italic"
            android:textAlignment="center" />
    </LinearLayout>
</HorizontalScrollView>

Other option layout files will be similar but with android:visibility="invisible". We will set to "visible" when necessary.

We can include this options layout files in main_layout.xml before the first scrollview:

<include layout="@layout/otions_default"/>
<include layout="@layout/options_info"/>
<include layout="@layout/options_files"/>

<ScrollView ...

This do the main layout file more small and readable.

We must go now to switch between ones and others, hiding and showing them:

In the MainActivity class I put an attribute to know what is the current shown panel:

private int subcmdId=R.id.options_default;

In the event method that run when the user do click, first that I do is show his options panels:

public void showInfo(View view){
        showOptions(R.id.options_info);

    [...]

For files action is:

public void showFiles(View view){
        showOptions(R.id.options_files);

    [...]

And this method showOptions is:

private void showOptions(int id){
        // Gets the current visible panel
        View v1=findViewById(subcmdId);

        // Gets the panel to show
        View v2=findViewById(id);

        // If was found
        if ((v1!=null)&&(v2!=null)) {
            v1.setVisibility(View.INVISIBLE);
            v2.setVisibility(View.VISIBLE);
            subcmdId = id; // Annotate the current panel
            Log.v(TAG,"Showing "+id);
        }else{
            Log.e(TAG, "showSubcmd. View not found:\n v1: "
        +v1+"\n v2: "+v2
        +"\n id1: "+subcmdId+"\n id2: "+id);
        }
    }

That's all for today... Kisses!!!