PMDM
Curso 2022-2023
Profesor: Iván Lorenzo DAM2
Hoja_UT2_10
Fragments
Crearemos una nueva aplicación: App_UT2_06
Vamos a realizar una aplicación con varios fragments para realizar la reserva de entradas del
zoológico.
DISEÑO
Antes de comenzar vamos a añadir las dependencias en el fichero build.gradle del módulo
//Navegación
implementation 'androidx.navigation:navigation-fragment:2.5.2'
implementation "androidx.navigation:navigation-ui-ktx:2.5.2"
Crearemos un gráfico de navegación llamado nav_graph.xml
Ahora vamos a la MainActivity. Ahí añadiremos en su diseño (activity_main.xml) un
NavHostFragment. El código del diseño podría ser similar al siguiente:
<androidx.constraintlayout.widget.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">
<androidx.fragment.app.FragmentContainerView
android:id="@+id/nav_host_fragment"
android:name="androidx.navigation.fragment.NavHostFragment"
android:layout_width="0dp"
android:layout_height="0dp"
app:defaultNavHost="true"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:navGraph="@navigation/nav_graph" />
</androidx.constraintlayout.widget.ConstraintLayout>
1
, PMDM
Curso 2022-2023
Profesor: Iván Lorenzo DAM2
Hoja_UT2_10
Ahora vamos a empezar a crear los fragments:
Crearemos un fragment llamado FragmentInicio. Se creará el layout asociado fragment_inicio.xml
Dejamos únicamente el método onCreateView
Para el diseño puedes utilizar el siguiente:
<?xml version="1.0" encoding="utf-8"?>
<layout 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"
tools:context=".FragmentInicio">
<ScrollView
android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:padding="16dp">
<ImageView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_gravity="center_horizontal"
android:layout_marginTop="8dp"
android:importantForAccessibility="no"
android:scaleType="centerInside"
app:srcCompat="@drawable/zoo" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:layout_marginBottom="16dp"
android:text="@string/reserva"
android:textAppearance="?attr/textAppearanceHeadline4"
android:textColor="@color/material_on_background_emphasis_medium" />
<Button
android:id="@+id/botonZoologico"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:layout_marginTop="8dp"
android:minWidth="250dp"
android:text="@string/zoologico" />
2
Curso 2022-2023
Profesor: Iván Lorenzo DAM2
Hoja_UT2_10
Fragments
Crearemos una nueva aplicación: App_UT2_06
Vamos a realizar una aplicación con varios fragments para realizar la reserva de entradas del
zoológico.
DISEÑO
Antes de comenzar vamos a añadir las dependencias en el fichero build.gradle del módulo
//Navegación
implementation 'androidx.navigation:navigation-fragment:2.5.2'
implementation "androidx.navigation:navigation-ui-ktx:2.5.2"
Crearemos un gráfico de navegación llamado nav_graph.xml
Ahora vamos a la MainActivity. Ahí añadiremos en su diseño (activity_main.xml) un
NavHostFragment. El código del diseño podría ser similar al siguiente:
<androidx.constraintlayout.widget.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">
<androidx.fragment.app.FragmentContainerView
android:id="@+id/nav_host_fragment"
android:name="androidx.navigation.fragment.NavHostFragment"
android:layout_width="0dp"
android:layout_height="0dp"
app:defaultNavHost="true"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:navGraph="@navigation/nav_graph" />
</androidx.constraintlayout.widget.ConstraintLayout>
1
, PMDM
Curso 2022-2023
Profesor: Iván Lorenzo DAM2
Hoja_UT2_10
Ahora vamos a empezar a crear los fragments:
Crearemos un fragment llamado FragmentInicio. Se creará el layout asociado fragment_inicio.xml
Dejamos únicamente el método onCreateView
Para el diseño puedes utilizar el siguiente:
<?xml version="1.0" encoding="utf-8"?>
<layout 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"
tools:context=".FragmentInicio">
<ScrollView
android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:padding="16dp">
<ImageView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_gravity="center_horizontal"
android:layout_marginTop="8dp"
android:importantForAccessibility="no"
android:scaleType="centerInside"
app:srcCompat="@drawable/zoo" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:layout_marginBottom="16dp"
android:text="@string/reserva"
android:textAppearance="?attr/textAppearanceHeadline4"
android:textColor="@color/material_on_background_emphasis_medium" />
<Button
android:id="@+id/botonZoologico"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:layout_marginTop="8dp"
android:minWidth="250dp"
android:text="@string/zoologico" />
2
