茨城エンジニアのPython開発日記

茨城のITベンチャー企業ではたらく2年目エンジニア。Pythonで色々なものを作成中。

C#でデスクトップアプリを開発してみた


ブログから記事を見つけたい場合はこちら

ブログ地図 - 茨城エンジニアのPython開発日記


こんにちは松原です。
C#GUIソフトを作成するときのメモです。
いくつかフレームワークがあるらしいけど、マークアップ言語でデザインいじれるらしいので基本的にWPFを使っていきたい。

思った以上に簡単だった。


手順
1. visual studioをインストール(このとき設定のオプションで、.NETでのデスクトップ開発を選択しておく)
2. visual studioでプロジェクト作成(テンプレートをWPFアプリケーションにしておく)
3. 適当に作成

基本的にいじるのはcsファイルとxamlファイル

こんな感じにボタンなどのパーツをはれる。簡単。
f:id:tottorisnow33:20211107134853p:plain


ボタンをダブルクリックすると、押下時のイベントハンドラ関数が自動生成される。簡単。

f:id:tottorisnow33:20211107135009p:plain

あとはパーツへのアクションに対する処理を書いていくだけ。
画像はbitmapとして取り扱ってるとのこと。opencv等との変換がめんどくさそう。
temp.pngなどを経由して処理するのがよさそう。

あと、最初に配置する画像はビルドアクションをリソースにする必要があるらしい。
プロジェクトの内部に元々保有される画像と認識させる必要があるっぽい。

bitmapimageについてはここを参照。
BitmapImage Class (System.Windows.Media.Imaging) | Microsoft Docs

適当に画像ビューアを作成。

ソースコードはこんな感じ。


・MainWindow.xaml

<Window x:Class="WpfApp1.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        xmlns:local="clr-namespace:WpfApp1"
        mc:Ignorable="d"
        Title="MainWindow" Height="450" Width="800">
    <Grid>
        <Button Content="画像変更" HorizontalAlignment="Left" Margin="105,108,0,0" VerticalAlignment="Top" Click="Button_Click"/>
        <Image x:Name="img_ctl" HorizontalAlignment="Left" Height="282" Margin="273,96,0,0" VerticalAlignment="Top" Width="429" Source="image/img_start.PNG" Stretch="Uniform"/>

    </Grid>
</Window>

・MainWindow.xaml.cs

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Data;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Imaging;
using System.Windows.Navigation;
using System.Windows.Shapes;

namespace WpfApp1
{
    /// <summary>
    /// Interaction logic for MainWindow.xaml
    /// </summary>
    public partial class MainWindow : Window
    {
        int image_cnt;

        public MainWindow()
        {
            image_cnt = 0;
            InitializeComponent();
        }

        private void Button_Click(object sender, RoutedEventArgs e)
        {
            /*画像のパス取得*/
            string image_apth = @"C://Users/nasu/Desktop/local_wk/211107C#desk/WpfApp1/WpfApp1/image/img";
            image_apth = image_apth + this.image_cnt.ToString();
            image_apth = image_apth + ".jpg";


            /*画像取得*/
            BitmapImage bmp = new BitmapImage();
            bmp.BeginInit();
            bmp.UriSource = new Uri(image_apth, UriKind.RelativeOrAbsolute);
            bmp.EndInit();

            /*画像設定*/
            img_ctl.Source = bmp;


            /*画像のIDインクリメント*/
            image_cnt = image_cnt + 1;
            image_cnt = image_cnt % 4;
        }
    }
}

xamlはてな記法で書く方法あるのあかな……

C#、画像の型が多くて取り扱いがめちゃくちゃ難しそう。
という訳でC#GUI入門でした。それでは。