.NET MAUI Blog プログラミング

【.NET MAUIで天気予報APIを利用する方法】Jsonデータをきれいに表示させよう

2023年7月2日

はじめに

前回の記事では、.NET MAUIアプリケーションで天気予報APIを利用する方法について詳しく説明しました。しかし、APIから取得したJsonデータはそのままでは読みづらく、理解しにくいことがあります。この記事では、Jsonデータをきれいに整形して表示させる方法について解説します。Jsonデータを整形することで、ユーザーにとってわかりやすい形式で天気予報を表示することができます。
前回までの「.NET MAUIで天気予報APIを利用する方法」については、以下のブログ記事を参考にしてください。

Jsonデータの整形方法

Jsonデータを整形するには、Newtonsoft.JsonパッケージのJsonConvertクラスを使用します。JsonConvertクラスには、Jsonデータを整形して表示するための便利なメソッドが用意されています。

以下のコードは、Jsonデータを整形して表示するための例です。

using Newtonsoft.Json;

namespace ApiSample01
{
    public partial class MainPage : ContentPage
    {
        int count = 0;
        private const string apiUrl = "https://weather.tsukumijima.net/api/forecast/city/130010";

        public MainPage()
        {
            InitializeComponent();
        }

        private async void ForecastClicked(object sender, EventArgs e)
        {
            try
            {
                using (var client = new HttpClient())
                {
                    var response = await client.GetAsync(apiUrl);
                    if (response.IsSuccessStatusCode)
                    {
                        var content = await response.Content.ReadAsStringAsync();

                        // JSONデータをデシリアライズしてオブジェクトに変換
                        var forecast = JsonConvert.DeserializeObject<Forecast>(content);

                        // 項目別に表示
                        ResultLabel.Text = $"東京の天気：{forecast.Title}\n";
                        ResultLabel.Text += $"発表時刻：{forecast.PublicTime}\n";
                        ResultLabel.Text += $"天気予報：\n";

                        foreach (var item in forecast.Forecasts)
                        {
                            ResultLabel.Text += $"日付：{item.Date}\n";
                            ResultLabel.Text += $"天気：{item.Telop}\n";
                            ResultLabel.Text += $"最低気温：{item.Temperature.Min?.Celsius} ℃\n";
                            ResultLabel.Text += $"最高気温：{item.Temperature.Max?.Celsius} ℃\n\n";
                        }

                        SemanticScreenReader.Announce(ResultLabel.Text);
                    }
                    else
                    {
                        await DisplayAlert("エラー", "Web APIの呼び出しでエラーが発生しました。", "OK");
                    }
                }
            }
            catch (Exception ex)
            {
                await DisplayAlert("エラー", "エラーが発生しました: " + ex.Message, "OK");
            }
        }

        public class Forecast
        {
            public string Title { get; set; }
            public string PublicTime { get; set; }
            public List<WeatherForecast> Forecasts { get; set; }
        }

        public class WeatherForecast
        {
            public string Date { get; set; }
            public string Telop { get; set; }
            public Temperature Temperature { get; set; }
        }

        public class Temperature
        {
            public TemperatureData Min { get; set; }
            public TemperatureData Max { get; set; }
        }

        public class TemperatureData
        {
            public string Celsius { get; set; }
        }
    }
}

JsonConvertがエラーになる場合、おそらくNewtonsoft.Jsonパッケージがプロジェクトに追加されていないか、正しくインポートされていない可能性があります。以下の手順で問題を解決できるか確認してください。

  1. プロジェクトにNewtonsoft.Jsonパッケージがインストールされていることを確認してください。プロジェクトファイル（.csproj）またはNuGetパッケージマネージャーからパッケージを追加できます。
  2. ソースコードの先頭に以下のusingディレクティブが含まれていることを確認してください。
using Newtonsoft.Json;



実行結果

ソースコード解説

このコードは、.NET MAUIアプリケーションで天気予報のデータを取得し、JSON形式のデータを解析して表示するためのものです。

  • まず、using Newtonsoft.Json;という行が含まれています。これはNewtonsoft.Jsonパッケージを使用するためのインポート文です。Newtonsoft.Jsonは、JSONのシリアル化とデシリアル化を行うための人気のあるライブラリです。このコードでは、APIから取得したJSONデータをデシリアライズしてオブジェクトに変換するために使用されます。
  • 次に、MainPageクラスが定義されています。これはContentPageクラスを継承しています。ContentPageは、.NET MAUIアプリケーションの単一の画面を表すための基本クラスです。
  • MainPageクラスには、ForecastClickedという非同期のイベントハンドラメソッドがあります。このメソッドは、ボタンがクリックされたときに呼び出されます。このメソッド内では、HTTPクライアントを使用して指定されたAPIのURLからデータを取得します。
  • APIからの応答が成功した場合（response.IsSuccessStatusCodeがtrueの場合）、取得したJSONデータをJsonConvert.DeserializeObject<T>()メソッドを使用してデシリアライズします。ここでTはデシリアライズするオブジェクトの型を指定します。このコードでは、Forecastオブジェクトに変換しています。
  • Forecastクラスは、天気予報のデータを格納するためのクラスです。Titleプロパティは天気予報のタイトルを、PublicTimeプロパティはデータの発表時刻を表します。また、Forecastsプロパティは天気予報のリストを表します。
  • WeatherForecastクラスは、個々の天気予報のデータを格納するためのクラスです。Dateプロパティは予報の日付を、Telopプロパティは天気の情報を表します。また、Temperatureプロパティは最低気温と最高気温の情報を持つTemperatureDataオブジェクトを表します。
  • TemperatureDataクラスは、気温のデータを格納するためのクラスです。Celsiusプロパティは摂氏温度を表します。
  • デシリアライズしたオブジェクトを使用して、ResultLabelのテキストを設定します。ResultLabel.Textには、天気予報のタイトル、発表時刻、各予報の日付、天気、最低気温、最高気温が表示されます。また、SemanticScreenReader.Announceメソッドを使用して、結果のテキストをスクリーンリーダーに読み上げさせます。
  • APIへのリクエストやデータの処理中にエラーが発生した場合は、try-catchブロック内で例外がキャッチされ、エラーメッセージが表示されます。
  • このコードでは、Newtonsoft.Jsonライブラリを使用してJSONデータを簡単に扱えるようにしています。また、Forecast、WeatherForecast、Temperature、TemperatureDataといった複数のクラスを使用することで、JSONデータの階層的な構造を表現し、データを効果的に取得して表示しています。

Newtonsoft.Jsonの概要と使う理由

Newtonsoft.Json（以下、Json.NET）は、.NET開発者にとって非常に人気のあるJson操作ライブラリです。Json.NETは、Jsonデータのシリアライズ（オブジェクトをJson文字列に変換する）およびデシリアライズ（Json文字列をオブジェクトに変換する）を行うための強力なツールセットを提供します。

Json.NETは、軽量かつ柔軟なJson処理を可能にするため、さまざまなプラットフォームや開発環境で広く利用されています。その使いやすさと高いパフォーマンスにより、Json.NETは.NET開発のデファクトスタンダードとなっています。

Json.NETの主な機能と利点には以下のようなものがあります:

  1. シリアライズとデシリアライズ: Json.NETは、オブジェクトとJsonデータの間でシームレスに変換を行うことができます。これにより、データの永続化やネットワーク間のデータの送受信など、さまざまなシナリオでJsonデータの扱いが容易になります。
  2. 柔軟なマッピング: Json.NETは、Jsonデータとオブジェクトのプロパティとの間で柔軟なマッピングを提供します。プロパティ名の一致や異なるデータ型の処理、データの欠落に対する柔軟な対応など、幅広いマッピングのニーズに対応できます。
  3. 高性能: Json.NETは、高速で効率的なJson処理を実現しています。そのパフォーマンスは、大量のデータや複雑なJson構造に対しても優れたパフォーマンスを発揮します。
  4. カスタマイズ可能性: Json.NETは、シリアライズやデシリアライズの動作をカスタマイズするための多くのオプションを提供します。これにより、処理の細かな制御や特定の要件に合わせた動作のカスタマイズが可能となります。

以上の理由から、Json.NETは.NET開発者にとって非常に便利なツールであり、特にJsonデータの処理やAPI連携において重要な役割を果たしています。


追加されたクラスと役割

上記のコードには、以下の4つのクラスが追加されています。それぞれのクラスは、天気予報APIから取得されるJsonデータの特定の項目を表現するために使用されます。

Forecastクラス

public class Forecast
{
    public string Title { get; set; }
    public string PublicTime { get; set; }
    public List<WeatherForecast> Forecasts { get; set; }
}

Forecastクラスは、天気予報の概要情報を表現するためのクラスです。このクラスには、天気予報のタイトル（Title）、公開時刻（PublicTime）、および天気予報のリスト（Forecasts）が含まれています。Forecastsリストには、WeatherForecastクラスのインスタンスが複数格納されます。

WeatherForecastクラス

public class WeatherForecast
{
    public string Date { get; set; }
    public string Telop { get; set; }
    public Temperature Temperature { get; set; }
}

WeatherForecastクラスは、個々の天気予報の詳細情報を表現するためのクラスです。このクラスには、日付（Date）、天気情報（Telop）、および気温情報（Temperature）が含まれています。気温情報はTemperatureクラスのインスタンスとして表現されます。

Temperatureクラス

public class Temperature
{
    public TemperatureData Min { get; set; }
    public TemperatureData Max { get; set; }
}

Temperatureクラスは、最低気温と最高気温の情報を表現するためのクラスです。このクラスには、最低気温（Min）と最高気温（Max）のプロパティが含まれています。気温情報はTemperatureDataクラスのインスタンスとして表現されます。

TemperatureDataクラス

public class TemperatureData
{
    public string Celsius { get; set; }
}

TemperatureDataクラスは、気温の数値を表現するためのクラスです。このクラスには、気温を表すCelsiusプロパティが含まれています。Celsiusプロパティは文字列型となっており、気温を摂氏（℃）で表します。

これらのクラスは、Jsonデータの特定の項目を表現するために使用されます。Json.NETのJsonConvert.DeserializeObjectメソッドを使用することで、Jsonデータをこれらのクラスのインスタンスに変換し、天気予報の情報を取り出すことができます。

まとめ

この記事では、.NET MAUIアプリケーションで天気予報APIから取得したJsonデータをきれいに整形して表示する方法について解説しました。JsonConvertクラスを使用してJsonデータを整形し、ユーザーにとってわかりやすい形式で天気予報を表示することができます。Jsonデータの整形は、情報の可読性を向上させるため重要な手法です。是非、これらの手法を活用して.NET MAUIアプリケーションの開発を進めてみてください。


-.NET MAUI, Blog, プログラミング