7
13

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 5 years have passed since last update.

Visual Studio for MacでiOSサンプルアプリ作る

Last updated at Posted at 2017-10-08

Visual Studio for MacでiOSアプリを作ってみたいと思います。
まず、Visual Studioを起動します。

スクリーンショット 2017-10-08 20.13.30.png

[New Project]をクリックします。

スクリーンショット 2017-10-08 20.20.42.png

左ツリーで[iOS]-[アプリ]を選択して、右ペインで[単一ビューアプリ]を選択します。

スクリーンショット 2017-10-08 20.23.09.png

[アプリ名]に任意の文字を入力して、[次へ]をクリックします。

スクリーンショット 2017-10-08 20.25.38.png

私は、場所を変更しましたが、気にならない方はそのまま[作成]ボタンを押します。

スクリーンショット 2017-10-08 20.27.41.png

Main.storyboardをダブルクリックで開きます。

スクリーンショット 2017-10-08 20.29.34.png

[VIEW AS]の右をクリックして、iphoneやipadを切り替えれます。
iphone X が発売されようとしている時期にiphone6までしか選べないのは、ちょっとびっくりしました。

スクリーンショット 2017-10-08 20.30.23.png

右上のペインで部品が検索できるので、検索して[label]と[button]をドラッグドロップで配置しました。

スクリーンショット 2017-10-08 20.39.15.png

Visual Studioで開発する要領でbuttonをダブルクリックすると、自動でクリックイベントのソースが表示されるかと思って、試すと下記の画面になりました。

スクリーンショット 2017-10-08 20.41.17.png

[ViewController.cs]が開かれてソースが表示されたので、Enterキーを押すと、コードが増えました。
ここら辺は、さすがVisual Studioだと思いました。

スクリーンショット 2017-10-08 20.43.44.png

「ボタンを押したら、labelの文字が変わる」という簡単なアプリを作ろうと思います。

先ほど作ったラベルにどうアクセスするのか、いつものVisual Studio開発と同じなら、プロパティに変数名を記載するところがあるはずと思って見ると、やっぱりありました。

ウィンドウ右下にプロパティペインがあります。

スクリーンショット 2017-10-08 20.49.09.png

ここの[Identity]の[Name]に「label01」と入力すると、ViewController.csでアクセスできるようになりました。
(うーん、さっきのボタンもName入力しておけば良かった。。。)

ViewController.csを次のように変えてみました。

ViewController.cs
using System;

using UIKit;

namespace SampleApp
{
    public partial class ViewController : UIViewController
    {
        partial void UIButton394_TouchUpInside(UIButton sender)
        {
            label01.Text = "変更したよ!";
        }

        protected ViewController(IntPtr handle) : base(handle)
        {
            // Note: this .ctor should not contain any initialization logic.
        }

        public override void ViewDidLoad()
        {
            base.ViewDidLoad();
            // Perform any additional setup after loading the view, typically from a nib.
        }

        public override void DidReceiveMemoryWarning()
        {
            base.DidReceiveMemoryWarning();
            // Release any cached data, images, etc that aren't in use.
        }
    }
}

ウィンドウ左上の実行ボタンっぽいボタンを押せば実行できるのかと思い、押すと。

スクリーンショット 2017-10-08 20.55.06.png

simulatorを選択する画面が表示され、わからないので[キャンセル]ボタンを押すと起動しました〜。
(追記:再生ボタン押す前にボタンの右でシミュレータ選べました。)

スクリーンショット 2017-10-08 21.02.09.png

あれ、さっきの[VIEW AS]ではiphone 6までしか選べなかったのに、シミュレータの下にはiphone 8の文字が。
もしかして、[VIEW AS]はディスプレイの大きさを選ぶだけなのかな。

ボタンを押すと、ラベルが変わりましたが、長さが足りなかった。。。

スクリーンショット 2017-10-08 21.03.49.png

Visual Studioで Windowsアプリケーションを作る感覚でできるのはすごいと思いました。

7
13
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
7
13

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?