Android TableLayouts

Let's move back to the Android implementation. This part is easy, we have already mapped the UI logic to the ChatPresenter so let's get straight into building the interface. For our ChatView.xml file, we are going to introduce a TableLayout. TableLayouts are similar to Grids in Xamarin.Forms; we simply split an area into rows and columns. We are able to set UI objects to specific rows and columns as well as span specific UI objects across multiple rows and columns.

Let's add a new file called ChatView.xml to the Resources | layout folder and implement the following:

<?xml version="1.0" encoding="utf-8"?>
 <TableLayout xmlns:android="http://schemas.android.com/apk/res/android"
     android:id="@+id/tableLayout"
     android:layout_width="fill_parent"
     android:layout_height="fill_parent"
     android:background="#FFFFFF">
     <TableRow
         android:id="@+id/tableRow1"
         android:layout_width="fill_parent"
         android:layout_height="100dp"
         android:padding="5dip">
         <EditText
             android:id="@+id/chatField"
             android:hint="Enter message"
             android:textColor="#000000"
             android:layout_weight="2"
             android:layout_column="1" />
         <Button
             android:id="@+id/sendButton"
             android:text="Send"
             android:textColor="#417BB5"
             android:background="@android:color/transparent"
             android:focusableInTouchMode="false"
             android:layout_weight="1"
             android:layout_column="3" />
     </TableRow>
     <TableRow
         android:id="@+id/tableRow2"
         android:layout_width="fill_parent"
         android:layout_weight="1"
         android:padding="5dip">
         <ScrollView
             android:id="@+id/scrollView"
             android:layout_width="match_parent"
             android:layout_height="match_parent"
             android:fillViewport="true"
             android:layout_weight="2"
             android:layout_span="4">
             <LinearLayout
                 android:id="@+id/scrollViewInnerLayout"
                 android:layout_width="match_parent"
                 android:layout_height="wrap_content"
                 android:orientation="vertical" />
         </ScrollView>
     </TableRow>
 </TableLayout> 

Each row is declared using the <TableRow> tag; our first row contains an EditText item for the messages, and a button to call the SendChat  function on the SignalRClient.

..................Content has been hidden....................

You can't read the all page of ebook, please click here login for view all page.
Reset
52.15.214.27