binding

MyFirstMauiApp/WeatherClient/Converters/WeatherConditionToImageConverter.cs

@@ -0,0 +1,30 @@
+using System;
+using System.Collections.Generic;
+using System.Globalization;
+using System.Linq;
+using System.Text;
+using System.Threading.Tasks;
+using WeatherClient.Models;
+
+namespace WeatherClient.Converters
+{
+    internal class WeatherConditionToImageConverter : IValueConverter
+    {
+        public object Convert(object value, Type targetType, object parameter, CultureInfo culture)
+        {
+            WeatherType weatherCondition = (WeatherType)value;
+
+            return weatherCondition switch
+            {
+                Models.WeatherType.Sunny => ImageSource.FromFile("sunny.png"),
+                Models.WeatherType.Cloudy => ImageSource.FromFile("cloud.png"),
+                _ => ImageSource.FromFile("question.png"),
+            };
+        }
+
+        public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture)
+        {
+            throw new NotImplementedException();
+        }
+    }
+}

MyFirstMauiApp/WeatherClient/MainPage.xaml

@@ -1,7 +1,11 @@
 <?xml version="1.0" encoding="utf-8" ?>
 <ContentPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
              xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
+             xmlns:cvt="clr-namespace:WeatherClient.Converters"
              x:Class="WeatherClient.MainPage">
+    <ContentPage.Resources>
+        <cvt:WeatherConditionToImageConverter x:Key="WeatherToImage"/>
+    </ContentPage.Resources>
 
     <Grid RowDefinitions="Auto,Auto,*,Auto" Margin="5">
         <VerticalStackLayout>
@@ -16,15 +20,15 @@
             <Rectangle BackgroundColor="Black" HeightRequest="4" Margin="2,10" />
             <Grid Grid.Row="2" RowDefinitions="Auto, Auto, Auto, Auto, Auto" ColumnDefinitions="Auto, Auto" Margin="0,5,0,0">
                 <Label Grid.Row="0" Grid.Column="0" Text="Condition" VerticalOptions="Center" />
-                <Image x:Name="imgCondition" Grid.Row="0" Grid.Column="1" HeightRequest="25" WidthRequest="25" Source="question.png" HorizontalOptions="Start" />
+                <Image Grid.Row="0" Grid.Column="1" HeightRequest="25" WidthRequest="25" Source="{Binding Condition, Converter={StaticResource WeatherToImage}}" HorizontalOptions="Start" />
                 <Label Grid.Row="1" Grid.Column="0" Text="Temperature" Margin="0,0,20,0" />
-                <Label x:Name="lblTemperature" Grid.Row="1" Grid.Column="1" Text="0" />
+                <Label Grid.Row="1" Grid.Column="1" Text="{Binding Temperature}" />
                 <Label Grid.Row="2" Grid.Column="0" Text="Humidity" Margin="0,0,20,0" />
-                <Label x:Name="lblHumidity" Grid.Row="2" Grid.Column="1" Text="0" />
+                <Label Grid.Row="2" Grid.Column="1" Text="{Binding Humidity}" />
                 <Label Grid.Row="3" Grid.Column="0" Text="Precipitation" Margin="0,0,20,0" />
-                <Label x:Name="lblPrecipitation" Grid.Row="3" Grid.Column="1" Text="0" />
+                <Label Grid.Row="3" Grid.Column="1" Text="{Binding Precipitation}" />
                 <Label Grid.Row="4" Grid.Column="0" Text="Wind" Margin="0,0,20,0" />
-                <Label x:Name="lblWind" Grid.Row="4" Grid.Column="1" Text="0" />
+                <Label Grid.Row="4" Grid.Column="1" Text="{Binding Wind}" />
             </Grid>
         </VerticalStackLayout>
     </Grid>

MyFirstMauiApp/WeatherClient/MainPage.xaml.cs

@@ -14,19 +14,7 @@
             btnRefresh.IsEnabled = false;
             actIsBusy.IsRunning = true;
 
-            Models.WeatherData weatherData = await Services.WeatherServer.GetWeather(txtPostalCode.Text);
+            BindingContext = await Services.WeatherServer.GetWeather(txtPostalCode.Text);
-
-            lblWind.Text = weatherData.Wind.ToString();
-            lblHumidity.Text = weatherData.Humidity.ToString();
-            lblPrecipitation.Text = weatherData.Precipitation.ToString();
-            lblTemperature.Text = weatherData.Temperature.ToString("#");
-
-            imgCondition.Source = weatherData.Condition switch
-            {
-                Models.WeatherType.Sunny => ImageSource.FromFile("sunny.png"),
-                Models.WeatherType.Cloudy => ImageSource.FromFile("cloud.png"),
-                _ => ImageSource.FromFile("question.png")
-            };
 
             btnRefresh.IsEnabled = true;
             actIsBusy.IsRunning = false;