Scribd
Upload
30 views10 pages

Layouts TP

Uploaded by

excelentevendasbrasil
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
30 views10 pages

Layouts TP

Uploaded by

excelentevendasbrasil
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 10

Bouira University-UAMOB

Développement d'applications mobiles


Mobile Application development
(Dr.DJELLABI Brahim)
2022-2023
The following examples show how to apply different layouts in Android

✓ FrameLayout
✓ LinearLayout
✓ TableLayout
✓ ScrollView
✓ HorizontalScrollView
✓ RelativeLayout
✓ ConstraintLayout
✓ GridLayout

LinearLayout with weight sum


<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="horizontal"
android:weightSum="3"
tools:context=".MainActivity">
<Button
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_margin="10dp"
android:layout_weight="1" />
<Button
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_margin="10dp"
android:layout_weight="1" />
<Button
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_margin="10dp"
android:layout_weight="1" />

</LinearLayout>
frameLayout with gravity
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:padding="5dp">

<TextView
android:id="@+id/txtvw1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="100dp"
android:layout_marginTop="10dp"
android:background="#286F24"
android:padding="10dp"
android:text="Login Details"
android:textColor="#FFFFFF"
android:textSize="20sp" />

<EditText
android:id="@+id/editText1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_marginTop="80dp"
android:background="#ECEEE8"
android:hint="Enter your email"
android:padding="10dp" />

<EditText
android:id="@+id/editText2"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_marginTop="155dp"
android:background="#ECEEE8"
android:hint="Enter password"
android:padding="10dp" />

<Button
android:id="@+id/btn1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="110dp"
android:layout_marginTop="240dp"
android:text="Submit" />
</FrameLayout>

Grid Layout
<?xml version="1.0" encoding="utf-8"?>
<GridLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:columnCount="4"
android:orientation="horizontal" >
<Button
android:layout_gravity="fill"
android:layout_column="0"
android:layout_columnSpan="3"
android:text="tttttttt" />
<Button
android:layout_column="3"
android:text="/" />
<Button android:text="1" />
<Button android:text="2" />
<Button android:text="3" />
<Button android:text="*" />
<Button android:text="4" />
<Button android:text="5" />
<Button android:text="6" />
<Button android:text="-" />
<Button android:text="7" />
<Button android:text="8" />
<Button android:text="9" />
<Button
android:layout_gravity="fill"
android:layout_rowSpan="3"
android:text="+" />

<Button
android:layout_gravity="fill"
android:layout_columnSpan="2"
android:text="0" />

<Button android:text="00" />


<Button
android:layout_gravity="fill"
android:layout_columnSpan="3"
android:text="=" />
</GridLayout>

LinearLayout without scrolling

<?xml version="1.0" encoding="utf-8"?>


<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">

<TextView
android:id="@+id/textView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="sdssdsfsfs sdssdsfsfsffs sdssdsfsfsffs sdssdsfsfsffs sdssdsfsfsffs
sdssdsfsfsffs sdssdsfsfsffs sdssdsfsfsffs sdssdsfsfsffs sdssdsfsfsffs sdssdsfsfsffs
sdssdsfsfsffs sdssdsfsfsffs sdssdsfsfsffs sdssdsfsfsffs sdssdsfsfsffs sdssdsfsfsffs
sdssdsfsfsffs sdssdsfsfsffs sdssdsfsfsffs sdssdsfsfsffs sdssdsfsfsffs sdssdsfsfsffs
sdssdsfsfsffs sdssdsfsfsffs sdssdsfsfsffs sdssdsfsfsffs sdssdsfsfsffs sdssdsfsfsffs
sdssdsfsfsffs sdssdsfsfsffs sdssdsfsfsffs sdssdsfsfsffs sdssdsfsfsffs sdssdsfsfsffs
sdssdsfsfsffs sdssdsfsfsffs sdssdsfsfsffs sdssdsfsfsffs sdssdsfsfsffs sdssdsfsfsffs
sdssdsfsfsffs sdssdsfsfsffs sdssdsfsfsffs sdssdsfsfsffs sdssdsfsfsffs sdssdsfsfsffs
sdssdsfsfsffs sdssdsfsfsffs sdssdsfsfsffs sdssdsfsfsffs sdssdsfsfsffs sdssdsfsfsffs
sdssdsfsfsffs sdssdsfsfsffs sdssdsfsfsffs sdssdsfsfsffs sdssdsfsfsffs sdssdsfsfsffs
sdssdsfsfsffs sdssdsfsfsffs sdssdsfsfsffs sdssdsfsfsffs sdssdsfsfsffs sdssdsfsfsffs
sdssdsfsfsffs sdssdsfsfsffs sdssdsfsfsffs sdssdsfsfsffs sdssdsfsfsffs sdssdsfsfsffs
sdssdsfsfsffs sdssdsfsfsffs sdssdsfsfsffs sdssdsfsfsffs sdssdsfsfsffs sdssdsfsfsffs
sdssdsfsfsffs ffs"/>
</LinearLayout>
ScrollView

<?xml version="1.0" encoding="utf-8"?>


<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">

<TextView
android:id="@+id/textView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="@string/m2isil"/>

</ScrollView>

Table layout
<?xml version="1.0" encoding="utf-8"?>
<TableLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginTop="10dp"
android:paddingLeft="5dp"
android:paddingRight="5dp">
<TextView
android:id="@+id/txt"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Maste2 SI Project"
android:textSize = "20dp"
android:textStyle="bold">
</TextView>

<TableRow android:background="#51B435" android:padding="10dp">


<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="Groupe" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="Project" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="Grade" />
</TableRow>
<TableRow android:background="#F0F7F7" android:padding="5dp">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="1kjhkhkh
" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="Sic" />

<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="5" />
</TableRow>
<TableRow android:background="#F0F7F7" android:padding="5dp">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="2" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="mob" />

<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="3.5" />

</TableRow>
<TableRow android:background="#F0F7F7" android:padding="5dp">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="3" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="Zimbra" />

<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="8" />

</TableRow>

<TableRow android:background="#F0F7F7" android:padding="5dp">


<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="4" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="ProcessMaker" />

<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="10" />

</TableRow>
</TableLayout>

ListView

➔In the main activity


public void ListViewAdapterImaging(View V) {
Intent intent = new Intent(this, ListViewAdapterImages.class);
startActivity(intent);

ListViewAdapterImages.class

package com.example.addition;

import static android.app.PendingIntent.getActivity;

import androidx.appcompat.app.AppCompatActivity;

import android.content.Intent;
import android.os.Bundle;
import android.view.View;
import android.widget.AdapterView;
import android.widget.ArrayAdapter;
import android.widget.ListView;

import java.util.ArrayList;

public class ListViewAdapterImages extends AppCompatActivity {

@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.listviwwithapater);

// create a arraylist of the type NumbersView


final ArrayList<OneViewInList> arrayList = new ArrayList<OneViewInList>();

// add all the values from 1 to 15 to the arrayList


// the items are of the type NumbersView

arrayList.add(new OneViewInList(R.drawable.download, "Team1","said bendaha"));


arrayList.add(new OneViewInList(R.drawable.download, "Team1","thanina safia"));
arrayList.add(new OneViewInList(R.drawable.download, "Team1","nour-el-houda
chabani"));
arrayList.add(new OneViewInList(R.drawable.download, "Team1","basma taoui"));
arrayList.add(new OneViewInList(R.drawable.download, "Team2","OMARI AMINA"));
arrayList.add(new OneViewInList(R.drawable.download, "Team2","omari akila"));
arrayList.add(new OneViewInList(R.drawable.download, "Team3","ayache soumia"));
arrayList.add(new OneViewInList(R.drawable.download, "Team3","sabounjdi safa"));
arrayList.add(new OneViewInList(R.drawable.download, "Team3","amel yahiaoui"));
arrayList.add(new OneViewInList(R.drawable.download, "Team4","sari thilelli"));
arrayList.add(new OneViewInList(R.drawable.download, "Team4","bouchifat lydia"));
arrayList.add(new OneViewInList(R.drawable.download, "Team5","ikram rabia"));
arrayList.add(new OneViewInList(R.drawable.download, "Team5","khelloufi lamia"));
arrayList.add(new OneViewInList(R.drawable.download, "Team5","ahcene
haddouche"));
arrayList.add(new OneViewInList(R.drawable.download, "Team5","elamouri marwa"));
arrayList.add(new OneViewInList(R.drawable.download, "Team6","abdelkader
benaissi"));
arrayList.add(new OneViewInList(R.drawable.download, "Team6","ibtissam saad"));
arrayList.add(new OneViewInList(R.drawable.download, "Team6","zohra chalhi"));
arrayList.add(new OneViewInList(R.drawable.download, "Team7","BERKAL FARIDA"));

// Now create the instance of the NumebrsViewAdapter and pass


// the context and arrayList created above
AdapterManager numbersArrayAdapter = new AdapterManager(this, arrayList);

// create the instance of the ListView to set the numbersViewAdapter


ListView MyListView = findViewById(R.id.listViewImage);

// set the numbersViewAdapter for ListView


MyListView.setAdapter(numbersArrayAdapter);

MyListView.setOnItemClickListener(new AdapterView.OnItemClickListener() {

@Override
public void onItemClick(AdapterView<?> adapterView, View view,int i , long l)
{
Intent intent=new
Intent(ListViewAdapterImages.this,listAdapternextactivity.class);
intent.putExtra("name",arrayList.get(i+1).getNumbersInText());
startActivity(intent);
};
});
}

OneViewInList
package com.example.addition;

public class OneViewInList {

// the resource ID for the imageView


private int ivNumbersImageId;

// TextView 1
private String mNumberInDigit;

// TextView 1
private String mNumbersInText;

// create constructor to set the values for all the parameters of the each single
view
public OneViewInList(int NumbersImageId, String NumbersInDigit, String
NumbersInText) {
ivNumbersImageId = NumbersImageId;
mNumberInDigit = NumbersInDigit;
mNumbersInText = NumbersInText;
}

// getter method for returning the ID of the imageview


public int getNumbersImageId() {
return ivNumbersImageId;
}

// getter method for returning the ID of the TextView 1


public String getNumberInDigit() {
return mNumberInDigit;
}
public String getNumbersInText() {
return mNumbersInText;
}
}

AdapterManager

package com.example.addition;

import androidx.annotation.NonNull;
import androidx.annotation.Nullable;
import androidx.appcompat.app.AppCompatActivity;

import android.content.Context;
import android.os.Bundle;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.ArrayAdapter;
import android.widget.ImageView;
import android.widget.TextView;

import java.util.ArrayList;

public class AdapterManager extends ArrayAdapter<OneViewInList> {

public AdapterManager(@NonNull Context context, ArrayList<OneViewInList> arrayList) {

// pass the context and arrayList for the super


// constructor of the ArrayAdapter class
super(context, 0, arrayList);
}

@NonNull
@Override
public View getView(int position, @Nullable View convertView, @NonNull ViewGroup
parent) {

// convertView which is recyclable view (temperarly view)


View currentItemView = convertView;
// of the recyclable view is null then inflate the custom layout for the same
if (currentItemView == null) {
currentItemView =
LayoutInflater.from(getContext()).inflate(R.layout.adapter_list_item, parent, false);
}

// get the position of the view from the ArrayAdapter


OneViewInList currentNumberPosition = getItem(position);
//***** currentItemView View or layout
//****currentNumberPosition is an object
// then according to the position of the view assign the desired image for the
same
ImageView numbersImage = currentItemView.findViewById(R.id.imageView);
assert currentNumberPosition != null; // confirm that is not null
numbersImage.setImageResource(currentNumberPosition.getNumbersImageId());

// then according to the position of the view assign the desired TextView 1 for
the same
TextView textView1 = currentItemView.findViewById(R.id.textView1);
textView1.setText(currentNumberPosition.getNumberInDigit());

// then according to the position of the view assign the desired TextView 2 for
the same
TextView textView2 = currentItemView.findViewById(R.id.textView2);
textView2.setText(currentNumberPosition.getNumbersInText());

// then return the recyclable view


return currentItemView;
}
}

listviwwithapater

<?xml version="1.0" encoding="utf-8"?>


<LinearLayout
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"
android:orientation="vertical"
tools:context=".MainActivity">

<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#9E4242"
android:text="Master Isil Projects"
android:textAppearance="@style/TextAppearance.AppCompat.Body1"
android:textColor="#F1EBEB"
android:textSize="30dp" />

<ListView
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="@+id/listViewImage"
android:divider="@color/black"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".MainActivity">
</ListView>
</LinearLayout>

adapter_list_item
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
>

<ImageView
android:id="@+id/imageView"
android:layout_width="84dp"
android:layout_height="84dp"
android:padding="16dp"
tools:ignore="ContentDescription" />

<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center_vertical"
android:orientation="vertical">

<TextView
android:id="@+id/textView1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="16dp"
android:gravity="bottom|left"
android:textColor="@android:color/black"
android:textSize="20sp"
android:textStyle="bold"
tools:ignore="RtlHardcoded" />

<TextView
android:id="@+id/textView2"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginBottom="16dp"
android:gravity="top|left"
android:textColor="@android:color/black"
android:textSize="20sp"
/>

</LinearLayout>

</LinearLayout>

You might also like