Fixed Tabs y Scrollable Tabs (Crear una view que se mantenga para todas las pestañas)

Para explicar esto nos vamos a ayudar de un ejemplo.

En nuestro caso queremos realizar un TPV (Terminal de Punto de Venta) en android, para ello usaremos Scrollable Tabs de forma que en cada tab sea una categoría de productos y de esa forma se muestren todos los productos de dicha categoría.

Al final de todas las Tabs tendremos la información del Total de la cuenta (lo que deberíamos cobrar).

En este punto es donde nos encontramos el problema, ya que si declaramos ese view en todas las pestaña vemos que al pasar de una a otra sucede lo que vemos en la siguiente imagen

Para evitar esto haremos lo siguiente:

Lo primero será crear un nuevo layout en res/layouts en el que crearemos la vista que queremos que permanezca inmutable en todas las tabs. En nuestro caso lo llamaremos total1.xml y contendra el siguiente codigo

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
     android:layout_width="fill_parent"
     android:layout_height="wrap_content"
     android:orientation="horizontal" >
     
    <LinearLayout 
     android:id="@+id/total2"
     android:layout_width="fill_parent"
     android:layout_height="wrap_content"
     android:layout_alignParentBottom="true"
     android:orientation="horizontal" android:background="@drawable/border" >

     <TextView
         android:id="@+id/total_titulo1"
         android:layout_width="wrap_content"
         android:layout_height="wrap_content"
         android:layout_weight="0.5" 
         android:background="#000000"
         android:text="Total"
         android:textAllCaps="true"
         android:textAppearance="?android:attr/textAppearanceLarge"
         android:textColor="#FFFFFF"
         android:textStyle="bold" 
         android:gravity="center"
     />

     <TextView
         android:id="@+id/total_total1"
         android:layout_width="wrap_content"
         android:layout_height="wrap_content"
         android:layout_weight="0.5"
         android:background="#888888"
         android:gravity="right"
         android:paddingRight="10dp"
         android:text="146.70€"
         android:textAllCaps="true"
         android:textAppearance="?android:attr/textAppearanceLarge"
         android:textColor="#FFFFFF"
         android:textStyle="bold" />

 </LinearLayout>
</RelativeLayout>

El motivo de encapsular un LinearLayout dentro de un RelativeLayout es poder colocar este LinearLayout al pie de la vista usando la propiedad android:layout_alignParentBottom="true".

Una vez hecho esto, debemos ir al codigo java del contenedor de las Tabs y colocar en el metodo onCreate() el siguiente codigo

 LayoutInflater inflater = LayoutInflater.from( getApplicationContext() );
  ViewGroup.LayoutParams layoutParams = new ViewGroup.LayoutParams( ViewGroup.LayoutParams.FILL_PARENT, ViewGroup.LayoutParams.WRAP_CONTENT );
  this.addContentView(inflater.inflate(R.layout.total1, null ), layoutParams);

Con esto conseguiremos que este view este fuera de las tabs, pero nos encontramos con otro problema, esta view tapa la "ultima linea" de lo que salia en la view de la tab y, como vemos en la imagen, en nuestro ejemplo no podemos ver bien la ultima fila de botones.

Esto tiene facil solucion, lo unico que deberemos hacer es darle un paddingBottom al layout de la Tab que nos permita librar la view del Total (OJO!!! vale mas pasarse que quedarse corto y esto es así por que en nuestro caso los buttons estan en una scrollview. Para otros casos habrá que tener mas cuidado)

 <ScrollView
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:layout_weight="1" >

        <GridLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:columnCount="3" 
            android:paddingBottom="40dp">

....

</ScrollView>