5. diel - Uloženie a načítanie dát v Xamarin pomocou textového súboru

V minulej lekcii kurze o vývoji multiplatformových mobilných aplikácií pomocou technológie Xamarin, Debug Xamarin aplikácie na Android zariadenia a Štýlovanie , sme sa venovali debugovania a štýlovanie. Dnes si vytvoríme aplikáciu typu poznámkový blok. Osvojíme si prácu s ukladaním a načítaním dát do / z súboru a neskôr aj SQLite databázy.

Rozloženie prvkov

Založíme nový prázdny projekt typu Xamarin.forms, ktorý pomenujeme napr. Poznamky. Než sa pustíme do programovania, aktualizujeme inštalované balíčky. To vykonáme tak, že v Solution Exploreri klikneme pravým tlačidlom na projekt Poznamky a vyberieme možnosť Manage nugety packages. Ďalej otvoríme záložku Installed, zaškrtneme všetko a zvolíme Update. Odsúhlasíme licenčné podmienky a môžeme začať s programovaním.

Otvoríme si súbor MainPage.xaml az elementu <contentPage></contentPage> odoberieme nasledujúce riadky + celý obsah medzi tagy <stackLayout></stackLayout>:

xmlns:d="http://xamarin.com/schemas/2014/forms/design"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d"

<StackLayout> upravíme do nasledujúcej podoby:

<StackLayout Margin="10,35,10,10">
        <Label Text="Poznámky"
               HorizontalOptions="Center"
               FontAttributes="Bold" />
        <Editor x:Name="editor"
                Placeholder="Napište poznámku"
                HeightRequest="100" />
        <Grid>
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="*" />
                <ColumnDefinition Width="*" />
        </Grid.ColumnDefinitions>
            <Button Text="Uložit"
                    Clicked="OnSaveButtonClicked" />
            <Button Grid.Column="1"
                    Text="Smazat"
                    Clicked="OnDeleteButtonClicked"/>
        </Grid>
</StackLayout>

XAML kód je jednoduchý a mal by nám všetkým byť jasný z minulej lekcie. V skratke sme vytvorili Label s tučným, vycentrovaným názvom "poznámky", textový editor s výškou 100 jednotiek a horizontálne rozložená tlačidla "Uložiť" a "Odstrániť". Súbor uložíme a presunieme sa do MainPage.xaml.cs.

MainPage.xaml.cs

Ako prvý môžeme vymazať nepotrebné príkazy using (tie šedivé).

Do tela triedy (ešte nad konštruktor MainPage()) pridáme cestu k súboru, do ktorého sa budú naše dáta ukladať alebo sa z neho naopak načítavať:

string _fileName = Path.Combine(Environment.GetFolderPath(Environment.SpecialFolder.LocalApplicationData), "poznamky.txt");

Pridáme si potrebný using system.IO podržaním kurzora na červeno podčiarknutie mieste a následným kliknutím na dropdown u žiarovky a výberom USING.

Teraz jednoduchú podmienkou zistíme, či súbor existuje. Ak áno, tak načítame uložený text:

if (File.Exists(_fileName))
{
    editor.Text = File.ReadAllText(_fileName);
}

Ostáva nám už len vytvoriť udalosti pre tlačidlá. Opäť to nie je nič zložité a určite kód každý chápe. Ak nie, odporúčam sa najprv vrátiť k základom C #, pretože nie sú súčasťou tohto tutoriálu.

void OnSaveButtonClicked(object sender, EventArgs e)
{
    File.WriteAllText(_fileName, editor.Text);
}

void OnDeleteButtonClicked(object sender, EventArgs e)
{
    if (File.Exists(_fileName))
    {
        File.Delete(_fileName);
    }
    editor.Text = string.Empty;
}

Na kontrolu bude celý kód MainPage.xaml.cs vyzerať takto:

using System;
using System.Collections.Generic;
using System.ComponentModel;
using System.IO;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
using Xamarin.Forms;

namespace Poznamky
{
    [DesignTimeVisible(false)]
    public partial class MainPage : ContentPage
    {
        string _fileName = Path.Combine(Environment.GetFolderPath(Environment.SpecialFolder.LocalApplicationData), "poznamky.txt");

        public MainPage()
        {
            InitializeComponent();

            if (File.Exists(_fileName))
            {
                editor.Text = File.ReadAllText(_fileName);
            }
        }

        void OnSaveButtonClicked(object sender, EventArgs e)
        {
            File.WriteAllText(_fileName, editor.Text);
        }

        void OnDeleteButtonClicked(object sender, EventArgs e)
        {
            if (File.Exists(_fileName))
            {
                File.Delete(_fileName);
            }
            editor.Text = string.Empty;
        }
    }
}

Nezostáva než pripojiť zariadenie alebo použiť emulátor a aplikáciu otestovať. Mala by vyzerať nejako takto:

Ako vidíme, program zatiaľ nie je moc prínosný. Poznámka sa síce uložia do súboru, takže keď aplikáciu vypneme, vymažeme z pamäte a opätovne spustíme, uvidíme opäť našu poznámku. Chcelo by to však mať možnosť ukladať viac poznámok. Aplikáciu hneď napravíme rozdelením na obrazovky pre výpis všetkých uložených poznámok, uloženie novej a editáciu tej existujúcej.

Aplikácie s viacerými obrazovkami

Ako sme si už hovorili, budeme teda musieť vytvoriť 3 rôzne obrazovky (stránky) a to:

• pre výpis poznámok
• vytvorenie novej
• editáciu existujúce

Aby bolo možné medzi stránkami prepínať, budeme potrebovať navigáciu a teda aj nejakú tú logiku. Neuspokojíme sa teda už len s jednou triedou MainPage.

Príprava prostredie

Najprv si pridáme do projektu novú zložku, ktorú pomenujeme Models/. Pravým tlačidlom klikneme v Solution Exploreri na projekt a vyberieme Add -> New Folder. V priečinku Models/ hneď vytvoríme C# triedu (pravým kliknutím na zložku Models/ a zvolením Add -> class). Aby sa nám to neplietlo a Visual Studio nekomolilo názvy, budeme už používať angličtinu a nazveme triedu anglicky - Note.cs.

Ďalej si pridáme 2 stránky obsahu - Notes.xaml a AddNote.xaml. Tie pridáme tak, že klikneme pravým tlačidlom myši na projekt a zvolíme Add -> New Item -> Content Page.

To by bolo pre dnešné lekciu všetko. V budúcej lekcii, Riešené úlohy k 1.- 6. lekcii Xamarin v C#.NET , si poznámkovú aplikáciu v Xamarin s ukladaním do súboru dokončíme a začneme pracovať na variante využívajúce databázu. Ak sa vám niečo nedarí a potrebujete kontrolu, celý projekt je k stiahnutiu nižšie.

V nasledujúcom cvičení, Riešené úlohy k 1.- 6. lekcii Xamarin v C#.NET, si precvičíme nadobudnuté skúsenosti z predchádzajúcich lekcií.

Mal si s čímkoľvek problém? Stiahni si vzorovú aplikáciu nižšie a porovnaj ju so svojím projektom, chybu tak ľahko nájdeš.