shuhelohelo’s blog

Xamarin.Forms多めです.

Azure Client SDKでリソースを作成する準備

docs.microsoft.com

Azureのリソースを作成する選択肢は,Azure Portal, Azure CLI, Azure PowerShell, Azure REST API, Azure Client SDKなど様々あり, 目的や状況に適したものを使うことができます.

ここではAzure Client SDKを使って,C#プログラムからAzureのリソースを作成するまでの手順をメモします.

具体的にはこちらです.

docs.microsoft.com

前提として,Azure CLIをインストールしておくこと.

SDKからAzureサブスクリプション内のリソースの読み取り,作成を行うアクセス許可を.NETアプリケーションに与える必要がある.

サービスプリンシパルを作成して,その資格情報でアクセスを許可するようにアプリを構成する.

  1. Azure Cloud Shellにログインする
  2. az account showを実行.以下の情報がJSON形式で得られる.
{
  "environmentName": "AzureCloud",
  "id": "15dbcfa8-4b93-4c9a-881c-6189d39f04d4",
  "isDefault": true,
  "name": "my-subscription",
  "state": "Enabled",
  "tenantId": "43413cc1-5886-4711-9804-8cfea3d1c3ee",
  "user": {
    "cloudShellID": true,
    "name": "jane@contoso.com",
    "type": "user"
  }
}
  1. az ad sp create-for-rbac --sdk-authを実行してサービスプリンシパルを作成する.

サービスプリンシパルとは以下のとおり。

サービス プリンシパル - 特定の Azure リソースにアクセスするためにアプリケーションまたはサービスによって使用されるセキュリティ ID です。 アプリケーションに対する "ユーザー ID" (ユーザー名とパスワード、または証明書) と考えることができます。

これは,Azure Active Directoryの範疇のようだ.

すると,以下のサービスプリンシパル情報がJSON形式で得られる.

{
  "clientId": "b52dd125-9272-4b21-9862-0be667bdf6dc",
  "clientSecret": "ebc6e170-72b2-4b6f-9de2-99410964d2d0",
  "subscriptionId": "ffa52f27-be12-4cad-b1ea-c2c241b6cceb",
  "tenantId": "72f988bf-86f1-41af-91ab-2d7cd011db47",
  "activeDirectoryEndpointUrl": "https://login.microsoftonline.com",
  "resourceManagerEndpointUrl": "https://management.azure.com/",
  "activeDirectoryGraphResourceId": "https://graph.windows.net/",
  "sqlManagementEndpointUrl": "https://management.core.windows.net:8443/",
  "galleryEndpointUrl": "https://gallery.azure.com/",
  "managementEndpointUrl": "https://management.core.windows.net/"
}

これをアプリケーションから利用する際は,userSecrets.json,に入れておき,安全を確保すると良い.

{
  "azure": {
    "credentials": {
      "clientId": "b52dd125-9272-4b21-9862-0be667bdf6dc",
      "clientSecret": "ebc6e170-72b2-4b6f-9de2-99410964d2d0",
      "subscriptionId": "ffa52f27-be12-4cad-b1ea-c2c241b6cceb",
      "tenantId": "72f988bf-86f1-41af-91ab-2d7cd011db47",
      "activeDirectoryEndpointUrl": "https://login.microsoftonline.com",
      "resourceManagerEndpointUrl": "https://management.azure.com/",
      "activeDirectoryGraphResourceId": "https://graph.windows.net/",
      "sqlManagementEndpointUrl": "https://management.core.windows.net:8443/",
      "galleryEndpointUrl": "https://gallery.azure.com/",
      "managementEndpointUrl": "https://management.core.windows.net/"
    }
  }
}

利用する際は以下のように.(参考)

using System;
using System.IO;
using Microsoft.Extensions.Configuration;

namespace AzureSDKPractice
{
    class Program
    {
        static void Main(string[] args)
        {
            Console.WriteLine("Hello World!");

            var confBuilder = new ConfigurationBuilder();
            var conf = confBuilder
                .AddUserSecrets<Program>(true)
                .Build();

            var clientId = conf["azure:credentials:clientId"];
            var clientSecret = conf["azure:credentials:clientSecret"];
            var tenantId = conf["azure:credentials:tenantId"];
            var subscriptionId = conf["azure:credentials:subscriptionId"];

....略

Virtual Networkの作成

サンプルにあるように作成する.

gist.github.com

            var creatableNetwork = azure.Networks
                            .Define("az-fluent-vnet")
                            .WithRegion(Region.UK_WEST)
                            .WithExistingResourceGroup("testing")
                            .WithAddressSpace("172.16.0.0/16");

OS Imageの確認の仕方

VMを作成する際には使用するOSのイメージを指定する必要がある. 指定に必要な情報はpublisher,"offer","sku"の3つの情報. これらはaz vm image listで確認でき,以下のJSON形式の情報が得られる.

[
  {
    "offer": "CentOS",
    "publisher": "OpenLogic",
    "sku": "7.5",
    "urn": "OpenLogic:CentOS:7.5:latest",
    "urnAlias": "CentOS",
    "version": "latest"
  },
  {
    "offer": "CoreOS",
    "publisher": "CoreOS",
    "sku": "Stable",
    "urn": "CoreOS:CoreOS:Stable:latest",
    "urnAlias": "CoreOS",
    "version": "latest"
  },
  {
    "offer": "debian-10",
    "publisher": "Debian",
    "sku": "10",
    "urn": "Debian:debian-10:10:latest",
    "urnAlias": "Debian",
    "version": "latest"
  },
  {
    "offer": "openSUSE-Leap",
    "publisher": "SUSE",
    "sku": "42.3",
    "urn": "SUSE:openSUSE-Leap:42.3:latest",
    "urnAlias": "openSUSE-Leap",
    "version": "latest"
  },
  {
    "offer": "RHEL",
    "publisher": "RedHat",
    "sku": "7-LVM",
    "urn": "RedHat:RHEL:7-LVM:latest",
    "urnAlias": "RHEL",
    "version": "latest"
  },
  {
    "offer": "SLES",
    "publisher": "SUSE",
    "sku": "15",
    "urn": "SUSE:SLES:15:latest",
    "urnAlias": "SLES",
    "version": "latest"
  },
  {
    "offer": "UbuntuServer",
    "publisher": "Canonical",
    "sku": "18.04-LTS",
    "urn": "Canonical:UbuntuServer:18.04-LTS:latest",
    "urnAlias": "UbuntuLTS",
    "version": "latest"
  },
  {
    "offer": "WindowsServer",
    "publisher": "MicrosoftWindowsServer",
    "sku": "2019-Datacenter",
    "urn": "MicrosoftWindowsServer:WindowsServer:2019-Datacenter:latest",
    "urnAlias": "Win2019Datacenter",
    "version": "latest"
  },
  {
    "offer": "WindowsServer",
    "publisher": "MicrosoftWindowsServer",
    "sku": "2016-Datacenter",
    "urn": "MicrosoftWindowsServer:WindowsServer:2016-Datacenter:latest",
    "urnAlias": "Win2016Datacenter",
    "version": "latest"
  },
  {
    "offer": "WindowsServer",
    "publisher": "MicrosoftWindowsServer",
    "sku": "2012-R2-Datacenter",
    "urn": "MicrosoftWindowsServer:WindowsServer:2012-R2-Datacenter:latest",
    "urnAlias": "Win2012R2Datacenter",
    "version": "latest"
  },
  {
    "offer": "WindowsServer",
    "publisher": "MicrosoftWindowsServer",
    "sku": "2012-Datacenter",
    "urn": "MicrosoftWindowsServer:WindowsServer:2012-Datacenter:latest",
    "urnAlias": "Win2012Datacenter",
    "version": "latest"
  },
  {
    "offer": "WindowsServer",
    "publisher": "MicrosoftWindowsServer",
    "sku": "2008-R2-SP1",
    "urn": "MicrosoftWindowsServer:WindowsServer:2008-R2-SP1:latest",
    "urnAlias": "Win2008R2SP1",
    "version": "latest"
  }
]

最終的に以下のコードで仮想マシンが作成される.

        static void Main(string[] args)
        {
            Console.WriteLine("Hello World!");

            var confBuilder = new ConfigurationBuilder();
            var conf = confBuilder
                .AddUserSecrets<Program>(true)
                .Build();

            var clientId = conf["azure:credentials:clientId"];
            var clientSecret = conf["azure:credentials:clientSecret"];
            var tenantId = conf["azure:credentials:tenantId"];
            var subscriptionId = conf["azure:credentials:subscriptionId"];

            var credentials = SdkContext.AzureCredentialsFactory
                .FromServicePrincipal(clientId, clientSecret, tenantId, AzureEnvironment.AzureGlobalCloud);
            var azure = Azure.Configure()
                .Authenticate(credentials)
                .WithSubscription(subscriptionId);//明示するのを推奨.


            var creatableNetwork = azure.Networks
                .Define("test-vm")
                .WithRegion(Region.JapanEast)
                .WithExistingResourceGroup("TestResourceGroup")
                .WithAddressSpace("172.16.0.0/16");

            var vmName = "test-vm";
            var rootId = conf["azure:vmRootInfo:rootId"];
            var rootPass = conf["azure:vmRootInfo:rootPassword"];

            azure.VirtualMachines
                .Define(vmName)
                .WithRegion(Region.JapanEast)
                .WithExistingResourceGroup("TestResourceGroup")
                .WithNewPrimaryNetwork(creatableNetwork)
                .WithPrimaryPrivateIPAddressDynamic()
                .WithoutPrimaryPublicIPAddress()
                .WithLatestLinuxImage("Canonical", "UbuntuServer", "18.04-LTS")
                .WithRootUsername(rootId)
                .WithRootPassword(rootPass)
                .WithComputerName(vmName)
                .WithSize(VirtualMachineSizeTypes.BasicA0)
                .Create();
        }

f:id:shuhelohelo:20200906171000p:plain

なるほど.

ソースコード

https://github.com/shuheydev/AzureSDKPractice

「The reference assemblies for .NETFramework,Version=v5.0 were not found. 」への対処

Visual Studioで現在プレビュー版の.NET5を使ってトップレベステートメントを試したときに以下のようなエラーメッセージが表示されました.

The reference assemblies for .NETFramework,Version=v5.0 were not found. 

Tools > OptionsでOptionsウィンドウを開いて,Environment > Preview Featuresの中でUse previews of the .NET Core SDK (requires restart)にチェックをつけてOKを押します.

f:id:shuhelohelo:20200902124936p:plain

Visual Studioを再起動します.

これでトップレベステートメントを実行できます.

前提として,対象のプロジェクトのcsprojファイル内で言語バージョンをプレビュー版が使えるように指定されている必要があります.

<Project Sdk="Microsoft.NET.Sdk.Web">

  <PropertyGroup>
    <TargetFramework>net5.0</TargetFramework>
    <LangVersion>preview</LangVersion>
  </PropertyGroup>

</Project>

コマンドラインでSDKを指定して.NETアプリケーションを作成する.

dotnetコマンドでプロジェクトを作成すると,一番新しいSDKが使用される. 現時点だとpreview版の.NET5をインストールしてあるので,dotnet new console -o Hogeとすると自動的にdotnet5のプロジェクトになる.

そこで-f|--framework <FRAMEWORK>オプションを使う.

<FRAMWORK> には以下の文字列が入る.

SDK version Default value
3.1 netcoreapp3.1
3.0 netcoreapp3.0

プロジェクトを作成する

HelloXUnitフォルダへ移動する.

> dotnet new console -o Hoge -f netcoreapp3.1

スマートホームを構築する際のRM Mini3とGoogle Homeの設定 初期設定~エアコン登録(2018年11月24日時点)[引越記事]

こちらがとても参考になります.

simple-was-best.com

はじめに

スマートホームを構築する手段はいろいろとありますが、今回は中でもとりわけ安価で有名な「RM Mini3(通称:黒豆)」と「Google Home」の組み合わせについて、その設定方法を説明したいと思います。

ことのはじまりは自分がRM Mini3とGoogle Homeを購入し、テレビやエアコンを音声で操作しようとしたときにRM Mini3側とGoogle Home側の設定でつまづきまくってほぼまる1日を費やしてしまったことです。 このスマートホームの分野は新しい分野のため、メーカー側の対応やアプリケーションの変更がよく行われ、ネットで設定方法を調べてみるとわずか1年の間であっても複数種類のやり方で出てきてどれが正しいのかわからなかったり、設定用のアプリケーションのUIが変わっていて目的のメニューにたどり着けなかったりします。

というわけで、今回の自分の経験をもとに2018年11月24日時点での設定方法を書こうと思った次第です。

必要なもの

手順概要

RM Mini3とGoogle Homeの設定手順は大まかにいって以下のとおりです。

  1. RM Mini3とGoogle Homeの購入
  2. RM Mini3設定用のスマホアプリ「IHC(Intelligent Home Center)」のインストール
  3. RM Mini3を自宅Wifiに接続
  4. IHCに家電を追加

RM Mini3とGoogle Homeの購入

Google Homeは家電量販店かGoogle公式サイトで購入してください。 家電量販店ならば「一定金額以上購入の場合に半額」というキャンペーンや、公式サイトなら「今なら8000円オフ」だったりします。

RM Mini3はGearBestかAliExpressで購入すると1500円程度で購入できます。 ただし納期は1週間から10日ぐらいかかります。 どちらも中国の通販サイトで英語表記なので少し手間ですが、基本的にはAmazonと変わりませんのでがんばりましょう。 なぜ海外サイトを使うのかというと、安いからです。 この商品の日本販売版であるeRemoteという商品がありますが、これは名前と色だけ変えただけの製品で、性能的には何も変わらず3倍以上の値段なので、もし急ぎでなければ海外サイトから購入する方が良いかと思います。

RM Mini3側の手順

IHC(Intelligent Home Center)アプリのインストール

日本ではPlayストアからインストールできません。 下記URLからAPKファイルをダウンロードしてインストールします。 https://www.apkmonk.com/app/cn.com.broadlink.econtrol.plus/

アプリのインストール[2020.07.21追記]

最初に起動するといくつかのパーミッションを求められますが,それらをすべて許可しないとアプリを起動できないので自己責任のもと,すべて許可します.

アカウント作成,ログイン[2020.07.21追記]

次はアカウントの作成を求められます. Facebookアカウントでのログイン,Emailや電話番号でのアカウント新規作成などいくつかの手段がありますが,好きな方法を選択してアカウントを作成します.

RM Mini3を自宅Wifiへ接続

IHCを使ってRM Mini3を自宅Wifiへ接続するのですが、このとき使うスマートフォンの言語を英語にしておく必要があります。

IHCを起動したら「Home」タブを選択して 「Add Device」ボタンを押します。

Screenshot_20181202-235858.png

[2020.07.21追記] 次の画面が表示されるのでUniversal Remotesを選択します.

f:id:shuhelohelo:20200721230725p:plain

次の画面でRM mini 3を選択します.

f:id:shuhelohelo:20200721231201p:plain

QRコードスキャン画面が表示されますが、画面下部の「Add device by category」を選択します。

Screenshot_20181202-235915.png

カテゴリーの中から「Universal Remotes」を選択します。 Screenshot_20181202-235924.png

「RM mini3」を選択します。 Screenshot_20181202-235930.png

下の画面が表示されたら、RM Mini3の電源コネクタの上部に「Reset」と書かれた穴があるので、何か細いものを使って5秒間長押しします。するとLEDが短く点滅を初めます。 その状態になったら「Next」ボタンを押します。

Screenshot_20181202-235945.png

WifiSSIDとパスワードを入力して「Next」ボタンを押します。

laskdjflaksdjfal.png

以下の画面が表示され、しばらくするとRM mini3のWifiへの接続が完了です。

Screenshot_20181203-000412.png

このRM mini3を置く場所を選択します。 これはIHC上でユーザーが機器を管理しやすいようにつけるタグなので、別にどれを選んでも動作は問題ありません。

好きな場所を選んでください。[2020.07.21追記]選択式ではなく,自由記入式になりました.+ボタンを押すと入力画面が開くので,名前をつけたらSaveボタンを押して保存します.今回,このRM mini 3をリビングに設置するので,Livingという名前にしました.

f:id:shuhelohelo:20200721234117p:plain

Screenshot_20181203-000427.png

RM mini3のWifiへの接続が完了すると、HomeタブにRM mini3が表示されます。

Screenshot_20181203-000628.png

RM mini3が登録できたら、スマートフォンの言語を日本語に戻して大丈夫です。

リモコン操作できる照明を登録

RM mini 3から操作する家電を登録していきます.

上記手順が完了した時点で,以下の画面が表示されていることと思います.

f:id:shuhelohelo:20200721234502p:plain

Lampを選択します.

もしくはホーム画面からRM mini 3を選択し,(スクショではすでにランプが登録されていますが)

f:id:shuhelohelo:20200722124403p:plain

次の画面で+ Add applianceを押すと家電選択画面が表示されます.

f:id:shuhelohelo:20200722124637p:plain

Lampを選択した後, メーカー名で検索できます. f:id:shuhelohelo:20200722125330p:plain

空調などであれば製品ごとのプリセットを利用すると良いですが,照明については一つの部屋に複数の同系機があってそれらをChannelを変えて操作します.

そのため,照明ごとに個別に操作するためにはプリセットではなくリモコンからの赤外線信号を学習させる必要があります.

リモコンを学習

以下のSelect brandの画面の一番下にCan't find my brand...を押します.

f:id:shuhelohelo:20200722130121p:plain

このような設定画面が表示されるので,Device nameに任意の名前をつけ,同じく場所を選択します.RM mini 3と同じLivingを選択します.

f:id:shuhelohelo:20200722130451p:plain

OKボタンを押します.

次の画面ではボタンがズラッと並んでいますが,それぞれのボタンにリモコンの各ボタンの赤外線信号を割り当てて行きます.

f:id:shuhelohelo:20200722130857p:plain

画面右上の・・・ボタンを押すとメニューが表示されるのでLearnを選択します.

f:id:shuhelohelo:20200722131000p:plain

ボタンのリストが表示されます.

f:id:shuhelohelo:20200722131045p:plain

ボタンの横にはLearnというボタンがあるので,学習を行いたいボタンのLearnを押します.すると以下のダイアログが表示されるので,RM mini 3に向けてリモコンのボタンを押します.

f:id:shuhelohelo:20200722131206p:plain

以下のような確認メッセージが表示されるので,Testボタンを押して照明が学習させたボタンのとおりに動作するかを確認します.

動作したらYes,動作しなかったらNoを押します.

f:id:shuhelohelo:20200722131908p:plain

Noを押すともう一度赤外線信号を登録する操作に戻ります.

こんな感じで必要な操作を登録していきます.

家電を登録

次に家電を登録します。 まずは簡単な空調から。 「デバイス」タブからRM mini3を選択します。

Screenshot_20181203-000636.png

Air conditionerを選択します。

Screenshot_20181203-000520.png

「エアコンメーカーマッチング」を選択し、選択します。

Screenshot_20181203-001040.png

自分が使っているエアコンメーカーを検索します。日本のメーカーはだいたい揃っています。ありがたや。

Screenshot_20181203-001040.png

自分が使っているエアコンに合った信号のタイプを選択します。 中央の「テスト」ボタンを押してエアコンのスイッチが入るか確認します。

Screenshot_20181203-001108.png

今のテストでエアコンが起動した場合、「はい」を選択します。そのエアコンを操作する信号のパターンがみつかりました。 何も反応がなければ「いいえ」を選択してください。 次のテストを行って、エアコンが動くまで繰り返します。

Screenshot_20181203-001131.png

これでエアコンの登録が完了です。 Google Homeに向かって、「ねえグーグル、エアコンをつけて」と言ってみましょう。 エアコンのスイッチが入るはずです。 温度設定などもできるのでいろいろ試してみてください。

エアコンは本当に簡単です。 テレビもコレぐらいの簡単さで設定できるといいのですが、そうもいかないのです。

今回はここまでです。 次はテレビの設定を書こうと思います。

Visual Studioの設定の移行 : インストール構成, Visual Studioの設定

docs.microsoft.com

複数のPCでVisual Studioを使っている場合,もしくは1つのPCで複数のバージョンのVisual Studioを使用する場合,それぞれのVisual Studioでワークロードを選択するのは手間ですし,インストール漏れがあったりしたら嫌です.(私の場合は複数バージョンのVSを入れる容量が足りないからですが)

また,エディタの設定や拡張機能をインストールしたりと,やることは沢山あります.

これらの手間を軽減するために,インストール構成及び設定に関する情報をそれぞれエクスポート,インポートすることができます.

環境

インストール構成

Visual Studioは開発の目的ごとにインストールする項目を選択することができます.

このインストール項目がワークロードと呼ばれるもので,Visual Studioのインストール時(もしくはインストール後にVisual Studio Installerで)に以下のような画面で機能を選択します.

f:id:shuhelohelo:20200716211536p:plain

そこで,このどのワークロードをインストールしているのかというインストール構成の情報をエクスポートし,それを他のVisual Studioでインポートすることで同じ環境を作ることができるようになっています.

エクスポート

まずは,Visual Studio Installerを起動します.

f:id:shuhelohelo:20200716211256p:plain

PCにインストールされているVisual Studioが表示されるので,インストール構成をエクスポートしたいVisual StudioのMoreというドロップダウンリストを開きます.

その中のExport configurationを選択します.

f:id:shuhelohelo:20200716212207p:plain

出力先を選択します.

f:id:shuhelohelo:20200716212532p:plain

最後にインストール構成を確認して,Exportボタンを押すと,エクスポートされます.

f:id:shuhelohelo:20200716212726p:plain

インポート

Visual Studio Installerでインストール構成をインポートしたVisual Studioのバージョンを選択して,先程と同じようにドロップダウンリストからImport Configurationを選択します.

これで,不足している分のワークロードがインストールされます.

Visual Studioの設定

インストール構成とは別にIDEとしての設定の情報もエクスポートする必要があります.

開発者にとって大事なのはこちらの情報かと思います.

Visual Studio 2019はアカウントが同じであれば同期されるようです.また,同一PC内のサイドバイサイドのインストールであれば,同じ設定ファイルが使用されるようになっているとのことです.

docs.microsoft.com

とはいえ,アカウント関係なしに同じ設定にしたいということもあるかも?ということで,以下設定情報のエクスポートとインポートです.

エクスポート

まずはVisual Studioを起動します.

Visual Studioのタイトルバーについている検索欄にExportとでも入力して検索すると以下のようにImport and Export Settingsという項目が見つかるので,これを選択します.

f:id:shuhelohelo:20200716215344p:plain

以下のウィンドウが表示されるのでExport selected environment settingsを選択してNextを押します.

f:id:shuhelohelo:20200716215506p:plain

エクスポートしたい情報を選択できるので,必要なものを選びます.

f:id:shuhelohelo:20200716215639p:plain

拡張機能についてはGeneral Settings > Extensionsにあります.

f:id:shuhelohelo:20200716215810p:plain

ぬぐぐ.このExtensionsは`拡張子`の方だった...

出力ファイル名,出力先を指定してFinishを押すとエクスポートされます.

インポート

同様にインポートを選択してインポートします.

おまけ: 拡張機能について

拡張機能については,インストール済みの拡張機能のリストを取得してテキストファイルなどに保存しておき,新しくインストールしたVisual Studio側でリストを参照しながらインストールする,という地道な方法がある.

Visual StudioのメニューからHelp > About Microsoft Visual Studioを選択する.

f:id:shuhelohelo:20200717135947p:plain

上記のウィンドウが開き,この中段のInstalled productsVisual Studioにインストールされている機能の一覧が表示される.

この中にインストールした拡張機能も含まれているので,Copy Infoボタンでコピーしてテキストファイルに貼り付けておく.

今の所,自分でできるのはこのあたりまで.

コマンドライン拡張機能をインストールできるのかな.できるのであればスクリプトを書けばよいのかもしれないけれど

LiveSharpを使ってコードの変更をアプリ再起動なしで即座に反映する

20200717追記

UIをすべてC#で書ける機能C#マークアップ拡張においては非常に有用なツールと思う.

devblogs.microsoft.com

もともとの本文

Xamarin.Forms(だけに限りませんが)は現時点でホットリロードが可能になっていて,Xamlの変更であればデバッグ中の変更が即座にエミュレータや実機に反映されるため,開発が非常に便利になっています.

ソースコードの変更についてはもちろんデバッグの停止と再実行を行う必要があります.

LiveSharpはXamarin.Forms(だけに限りませんが)のデバッグ中のコードの変更をデバッグの停止・再実行を行うことなく,そのままエミュレータや実機に反映することができるアプリケーションです.

www.livesharp.net

インストール

公式サイトの手順のとおりです.

LiveSharpはサーバーとクライアントに分かれており,サーバーをdotnet toolコマンドでPCにインストールし,クライアントをプロジェクトにNugetでインストールします.

ですのでサーバーのインストールはPCへの1回だけです.

サーバーのインストール

コマンドラインで以下のコマンドを実行し,インストールします.

dotnet tool install --global livesharp.server

クライアントのインストール

Nugetでインストールします.

LiveSharp.Serverというパッケージがありますが,これは無視します.上記のとおり,サーバーはコマンドからインストールします.

f:id:shuhelohelo:20200715155805p:plain

実行

まずはLiveSharpのサーバーを起動します.

コマンドラインから以下のコマンドを実行します.

>livesharp

これでサーバーが起動しました.

f:id:shuhelohelo:20200715160222p:plain

サーバーを停止する場合はCtrl+Cです.

MVVMな形でサンプルプログラムを作成しました.

以下のViewModelを作成しました.

using MvvmHelpers;
using System;
using System.Collections.Generic;
using System.Text;

namespace XFHabitTracker.ViewModels
{
    public class HabitListViewModel : BaseViewModel
    {
        private string _message = string.Empty;
        public string Message
        {
            get => _message;
            set => SetProperty(ref _message, value);
        }

        public HabitListViewModel()
        {
            Message = "こんにちは!";
        }
    }
}

MvvmHelpersというライブラリを使っていますが,中でやっていることはプロパティの変更を通知する,といういつものことです.

Messageというプロパティがあって,これがView側のLabelのTextプロパティにバインディングされています.

            <Label
                FontSize="Large"
                HorizontalOptions="CenterAndExpand"
                Text="{Binding Message}"
                VerticalOptions="CenterAndExpand" />

それではアプリをデバッグ実行します.

デバッグを開始すると,ブラウザで以下のようなページが表示され,ここでLiveSharpのログを見れたりします.

f:id:shuhelohelo:20200715164400p:plain

さて,今回はエミュレータを使っていますが,以下のようにMessageプロパティにセットした文字列が表示されます.

f:id:shuhelohelo:20200715163241p:plain

次に,デバッグを実行したまま,ViewModelのMessageプロパティにセットする文字列を以下のように変更します.

f:id:shuhelohelo:20200715163440p:plain

そして保存すると,以下のようにエミュレータに表示されている文字列も変化します.

f:id:shuhelohelo:20200715163550p:plain

通常であれば,ここはデバッグの停止・再実行が必要な場面です.

これはかなり便利ですね.

LiveSharpはサブスクリプション型のアプリケーションで,個人であれば月々9.9ドルからになっています.

まだ使い始めたばかりですが,Xamlの変更だけでなくロジックの方の変更によって生じるViewの変化もリアルタイムで確認できるというのは,とても便利な気がします.

正直,ありかな,と.

App Center経由のデプロイでバージョン番号やバージョン名を変更する

これまでにde:code2020用アプリMy de:code 2020を作成し,App Centerを利用してビルド→ストア公開までを自動で行えるようにした.

また,アプリのアイコンやアプリ名などの変更方法にも触れてきた.

しかしもう一つ問題があった.

バージョンが1.0のままだ.

f:id:shuhelohelo:20200714172342p:plain

ストアのアップデートだけでも3回はアップデートしているし,開発過程でのビルド回数は29回になっている.

ここに表示されているのはVersion Nameで,ストアでユーザーに表示されるものです.未だに1.0のままでした.

f:id:shuhelohelo:20200714183038p:plain

さて,これはAndroidManifest.xmlを編集するか,もしくはAndroidプロジェクトのプロパティで変更します.

どちらでも構いません.

ここではプロパティから変更します.

Androidプロジェクトのプロパティを開きます.ソリューションエクスプローラAndroidプロジェクトを右クリックしてコンテキストメニューからプロパティを選択します.

以下のようにプロパティタブが開きます.

f:id:shuhelohelo:20200714183319p:plain

左のメニューからAndroid Manifestを選び,その中のVersion nameという項目に任意の文字列を入力します.

ここでは1.1.0.0としました.完全に適当です.

f:id:shuhelohelo:20200714183810p:plain

Version numberはどうするのかというと,本来であればストアに新しいバージョンのアプリを公開,つまりアップデートする場合は,この番号を1つ(以上)を上げる必要があります.同じ番号だとアップデート扱いされないということでしょうか.試してないですけど.

しかし,App Center側でビルドごとにインクリメントする設定にしているため,Visual Studio側での設定は不要です.App Center側ではこれをVersion codeと読んでいるようです.

f:id:shuhelohelo:20200714184255p:plain

さて,それではこの設定でApp Center経由でアプリを実機に配置してみます.

自動ビルドの結果,App Center側ではリリースの履歴には以下のようにバージョン情報が1.1.0.0(30)になっています.

f:id:shuhelohelo:20200714193300p:plain