Tehdään WPF-sovellus - 20 - Näyttävät tulokset

Toteutetaan tulokset uutena näkymänä

Lisätään InputViewin tapaan tuloksille oma näkymänsä: ResultView (UserControl).

Aloitetaan jo hyväksi koetulla tavalla, eli mahdollisimman yksinkertaisella ensimmäisellä toteutuksella. Korvataan oletuksena kontrollilla oleva Grid suoraan Border-elementillä, jotta saamme tulokset näkymään mukavasti pyöristetyn suorakulmion sisällä. Jätetään myös tuloksen teksti vielä asettamatta ja näytetään vakioteksti vielä toistaiseksi.

<UserControl ...>
    <Border Margin="24"
            Style="{StaticResource ItemBorder}">
        <Grid VerticalAlignment="Center">
            <Grid.RowDefinitions>
                <RowDefinition />
                <RowDefinition />
            </Grid.RowDefinitions>
            <TextBlock Text="BMI" />
            <TextBlock Grid.Row="1"
                       Text="123" />
        </Grid>
    </Border>
</UserControl>

Jos haluat vilkaista miltä juuri luomamme tulossivu näyttää sovelluksessa, niin tee näin:

Näytä tulosnäkymä pääikkunan sisällä tekemällä seuraava lisäys MainWindow.xaml-tiedostoon juuri ennen painikkeen elementtiä. Tämän jälkeen voit tarkastella tulosta Design-ikkunassa, tai käynnistämällä ohjelman:

+<local:ResultView/>

<Button Grid.Row="1">

Käynnistetään sovelluksemme hallitummin

Nykyisellään käynnistämme sovelluksemme App.xaml:lla määritetyllä StartupUri-arvolla:

<Application StartupUri="MainWindow.xaml">

Tämä toteutus ei anna meille tarpeeksi vapauksia päättää miten haluaisimme sovelluksemme käynnistyvän. Tavoitteenamme olisi, että sovellus voisi onnistuneesti vetää itsensä ylös kengännauhoistaan vetämällä (bootstrapping).

Kolmannen osapuolen MVVM-totetuksissa on yleensä omat tapansa toteuttaa käynnistys mitä hienoimmilla asetuksilla ja kustomisoinneilla, mutta meille riittää vielä kaikkein yksinkertaisin tapa.

Tehdään siis seuraavat muutokset:

1) Poistetaan edellä mainittu StartupUri App.xaml-tiedostosta:

 <Application
-             StartupUri="MainWindow.xaml">

2) Lisätään App.xaml.cs-tiedostoon paikka pääikkunan käynnistykselle ylikirjoittamalla App.OnStartup-funktio:

public partial class App : Application
{
    protected override void OnStartup(StartupEventArgs e)
    {
        base.OnStartup(e);
    }
}

Lisätään uuden MainWindow:n alustus ja näyttäminen juuri ylikirjoittamallemme OnStartup-funktiolle:

protected override void OnStartup(StartupEventArgs e)
{
    base.OnStartup(e);

    var mainWindow = new MainWindow();
    mainWindow.Show();
}

Käytännössä mitä teimme, niin ohitimme StartupUri:n määrittämän käynnistyslogiikan, jotta pääsisimme käsiksi aikaan ennen pääikkunan käynnistymistä. Näin ikkunan näyttäminen on paremmin hallinnassamme 👍

Tämän muutoksen jälkeen olisi vielä hyvä hetki kokeilla, että sovellus varmasti käynnistyy vielä tekemiemme muutostenkin jälkeen ennen seuraavaan vaiheeseen siirtymistä!

Useamman jakson verran tässä ollaan sitä jo lupailtu, mutta eiköhän aloiteta ihan oikeasti se itse MVVM:n tykittäminen seuraavassa osassa!

Anssi Kettunen

Ohjelmistokehittäjä suorittamassa tehtävää 🦊

Jaa sisältöä: