Proyecto: Pomodoro

Resumen

Pomodoro es una técnica sencilla para la administración del tiempo que conciste básicamente en ciclos de trabajo de 25 minutos, seguidos de ciclos de descanso de 5 minutos.

Para este proyecto usaremos el formato de páginas de MasterDetailPage.

La aplicación constará de tres páginas:

Configuración: para definir las duraciones usadas en los pomodoros
Histórico de pomodoros completados: para listar todos los pomodoros completados
Activación de los ciclos del pomodoro: para iniciar y detener los ciclos de pomodoros

Pondremos en práctica todo lo aprendido en el curso y generaremos al final una aplicación nativa para Android.

En esta clase creamos la estructura general de la aplicación, el menú de navegación y el ViewModel de la vista de Configuración.

Jesús Alberto Rivera López

student•

Si estan usando Xamarin.Forms v.5.0 deben elegir un Flyout Page ya que el MasterDetial Page ya es considerado obsoleto.

Dylan Ivan Villarreal Toscano

student•

cual es la diferencia?

Rubén Esparza

student•

Aquí en este momento debemos de cambiar el MainPage por el RootPage nuevo que acabamos de crear.

Francisco Javier Encina

student•

Después de casi una hora entendi tu comentario jaja

Javier Andres Ren

student•

estaba pensando justo en ello porque no me abría el masterpage.

DTI SEMAIG

student•

Cómo puedo leer un archivo de base de datos de sqlite

Yesid Anacona

student•

No compriman tanto los videos, no se ve nada.

renzo david chavez calderon

student•

Si no les Muestra el menú, deben cambiar en App.xaml.cs el MainPage por el El RootPage asi:

public App()
        {
            InitializeComponent();

            MainPage = new NavigationPage(new RootPage());
        }

Carlos Orjuela

student•

Como aporte, he creado una librería de clases (.Net Standard), llamada "Utilities". Esta con el fin de agregar todas aquellas clases que son transversales y necesarias a este o mas proyectos que pueda crear: ejemplo, "NotificationObject". Asi esta libreria la puedo usar en mis demás proyectos, tan solo llevándome la dll: . .

Marcos Avila Rodriguez

student•

Es una excelente idea, saludos.

Santiago Dolores

student•

En Xamarin para MAC, como agregó la plantilla Master Detail?

Las únicas opciones que tengo son:

RODRIGO DIAZ CONCHA

teacher•

Hola @SantiagoDlsMx

¿Es la última versión de Visual Studio 2017 for Mac?

Brandon Ramsel Vite Delgadillo

student•

Tengo el mismo problema de Santiago, y mi VS esta acutalizado.

carlos emmanuel arcos novelo

student•

No tengo errores pero no me muestra la barra de navegación, este es mi codigo:

RootOageViewModel.cs

using System;
using System.Collections.Generic;
using System.Text;
using System.Collections.ObjectModel;
using Xamarin.Forms;

namespace Pomodoro.ViewModels
{
    public class RootPageViewModel : NotificationObject
    {
        private ObservableCollection<string> menuItems;

        public ObservableCollection<string> MenuItems
        {
            get { return menuItems; }
            set {
                menuItems = value;
                OnPropertyChanged();
            }
        }

        private string selectedMenuItem;

        public string SelectedMenuItem
        {
            get { return selectedMenuItem; }
            set {
                selectedMenuItem = value;
                OnPropertyChanged();
               }
        }


        public RootPageViewModel()
        {
            MenuItems = new ObservableCollection<string>();
            MenuItems.Add("Pomodoro");
            MenuItems.Add("Historico");
            MenuItems.Add("Configuración");

            PropertyChanged += RootPageViewModel_PropertyChanged;
        }

        private void RootPageViewModel_PropertyChanged(object sender, System.ComponentModel.PropertyChangedEventArgs e)
        {
            if(e.PropertyName == nameof(selectedMenuItem))
            {
                if(selectedMenuItem == "Configuración")
                {
                    MessagingCenter.Send(this, "GoToConfiguraion");
                }
            }
        }

    }
}```

RootPage.xaml

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

<MasterDetailPage.Master> <ContentPage Title="Master"> <ListView ItemsSource="{Binding MenuItems}" SelectedItem="{Binding SelectedMenuItem, Mode=TwoWay}"/> </ContentPage> </MasterDetailPage.Master>

<MasterDetailPage.Detail> <NavigationPage> <x:Arguments> <pages:RootPageDetail /> </x:Arguments> </NavigationPage> </MasterDetailPage.Detail> </MasterDetailPage>```

![](

Montano Sarmiento

student•

en la Clase App debes cambiar la linea asi: MainPage = new RootPage();

Ludian Quiñones Solano

student•

como hago profe para que no se me ejecute el MainPage.xaml y me muestre el master detail no encuentro error todo me sale bien pero cuando compilo no me muestra el rootpage

Luis Miguel Avila Soto

student•

Debes establcer que tu MainPage va a ser RootPage en app.xaml.cs

Lucas Gabriel Bica

student•

Apenas creo el elemento “Master Detail” me sale en el archivo RootPage.xaml que puede ser que me falte algun namespace porque no encontró el tipo “RootPageMaster”

<?xml version=“1.0” encoding=“utf-8” ?>

Lucas Gabriel Bica

student•

SOLUCIONADO
Actualicé Visual Studio y se corrigieron un montón de bugs que en el curso no aparece. Lo raro es que la versión que tenía era superior a la que se uso en el momento que grabaron este curso…

Miguel Angel Valverde Meregildo

student•

¿Todas las propiedades definidas en los ViewModels no deben de estar declaradas en el Model (una carpeta aparte)?, ¿Ese no viene siendo mi modelo de datos?.
Esa parte no la tengo clara con el Model.
Todo esto lo pregunto ya que quisiera aplicar el patrón de diseño de manera correcta.

RODRIGO DIAZ CONCHA

teacher•

Tu Model tendrá las propiedades que ayuden a definir el objeto en cuestión. Por ejemplo:

public class Persona 
{
   public string Nombre { get; set; }
   public DateTime FechaNacimiento { get; set; }
   //Etc.
}

En tu ViewModel, expondrás las propiedades necesarias para que el View tenga todo lo necesario. Ejemplo:

public class PersonasViewModel
{
   private ObservableCollection<Persona> personas;
   public ObservableCollection<Persona> Personas
   {
       get
       { 
            return personas; 
       }
       set
       {
          if (personas == value)
          {
              return;
          }
          OnPropertyChanged();
       }
    }
}

Miguel Angel Valverde Meregildo

student•

En el ViewModel colocaría propiedades que tendrán lógica de negocio y en el Model también puedo colocar propiedades pero solo su definición. ¿Así sería?.

Luis Miguel Avila Soto

student•

Por qué al guardar el SelectedPomodoroDuration y el SelectedPomodoroBreakDuration lo guarda ene l diccionario de propiedades de Application y no de app como lo habia hecho al principio ?

RODRIGO DIAZ CONCHA

teacher•

Hola @lavilaso,

App hereda de Application, y el diccionario de propiedades es un miembro estático, por lo que ambas expresiones son correctas y es lo mismo.

Salu2!

Andre Huaman Yovera

student•

Implementando FlyoutPage .

Ricardo Vazquez Melchor

student•

Hola! tengo un problema con el RootPageMaster.xaml.cs, me sale este error:

class RootPageMasterMasterViewModel : INotifyPropertyChanged
        {
            public ObservableCollection<RootPageMasterMenuItem> MenuItems { get; set; }

            public RootPageMasterMasterViewModel()
            {
                MenuItems = new ObservableCollection<RootPageMasterMenuItem>(new[]
                {
                    new RootPageMasterMenuItem { Id = 0, Title = "Page 1" },
                    new RootPageMasterMenuItem { Id = 1, Title = "Page 2" },
                    new RootPageMasterMenuItem { Id = 2, Title = "Page 3" },
                    new RootPageMasterMenuItem { Id = 3, Title = "Page 4" },
                    new RootPageMasterMenuItem { Id = 4, Title = "Page 5" },
                });
            }

            #region INotifyPropertyChanged Implementation
            public event PropertyChangedEventHandler PropertyChanged;
            void OnPropertyChanged([CallerMemberName] string propertyName = "")
            {
                if (PropertyChanged == null)
                    return;

                PropertyChanged.Invoke(this, new PropertyChangedEventArgs(propertyName));
            }
            #endregion
        }

The name 'MasterPage' does not exists in the current context

The type or namespace name 'RootPageMasterMenuItem' could not be found (are you missing a using directive or an assembly reference?

Montano Sarmiento

student•

esa clave ViewModel debe heresar de NotificationObject tu la tienes heredando de la Interface INotificationObject...

Proyecto: Pomodoro

Introducción a Xamarin

¡Renovamos este contenido con cursos de .NET MAUI!

Antes de empezar

Todo lo que aprenderás sobre Xamarin Forms

¿Qué es Xamarin?

Instalación y configuración

Requerimientos de hardware y software

Introducción a Instalación de Visual Studio .NET y Herramientas

Instalación de Visual Studio .NET en Windows

Instalación de Visual Studio .NET for Mac

Configuración de Xamarin para iOS

Fundamentos de Xamarin.Forms

Mi primera app con Xamarin.Forms

Xamarin.Forms vs. Xamarin clásico

Estrategias para compartir código

Arquitectura de Xamarin.Forms

Anatomía de una aplicación

Arquitectura de Xamarin.Forms

Sistema de Propiedades Enlazables

Sistema de Propiedades Enlazables

Usando y creando Propiedades Enlazables

Propiedades Adjuntas

Manejo de Eventos

Manejo de eventos

Ciclo de vida

El Lenguaje XAML

¿Qué es XAML?

Espacios de Nombres XML

Sintaxis de subelementos y de contenido

Extensiones de Marcado

Recursos

XAML compilado

Interfaz de Usuario

Contenedores

Controles comunes

Creación de controles personalizados

Estilos

Triggers en Estilos

Diccionarios Mezclados

Transformaciones y Animaciones

Navegación

DisplayAlert y DisplayActionSheet

MessagingCenter

Enlace de Datos

Enlace de Datos

Interfaces de notificación

La clase ObservableCollection&amp;lt;t&amp;gt;

Contexto de Enlace de Datos

Enlace entre elementos

Propiedad StringFormat

Plantillas de Datos

Convertidores de Valor

Comandos

¿Qué son los Comandos?

Implementación básica e implementaciones existentes

El Patrón de Diseño Model-View-ViewModel (MVVM)

Introducción al patrón de diseño MVVM

¿Qué es MVVM?

Componentes del Patrón

Proyecto: Pomodoro

App Pomodoro

Continuando con la app Pomodoro

Concluyendo nuestra app Pomodoro

La clase ObservableCollection<t>