【Xcode7】Storyboardを使ってMacアプリ開発に挑戦。

公開 :

何だか今日はトイレが近い。@It_is_Rでございます。
現在開発中の人魚のゲームは今ストーリーを練っている所です。まだまだ時間がかかりそうです。

さて、Rは今、Macアプリ開発を勉強中なのですが、今回はStoryboardを使って、文字表示など、いろいろやってみたいと思います。
まだまだ勉強中の身なので、間違っていたりしたら、ご指摘いただけると嬉しいです。

開発環境はMac OS X El Capitan、Xcode7を使用しています。

プロジェクトについて

eyecatch_woman3
まずはプロジェクトを作ってみましょう。

新しいプロジェクトの作成

まずは新しくプロジェクトを作成します。
Xcode7を開いたら、「Create a new Xcode project」をクリックします。
Welcome to Xcode

次の様な画面が開きました。
今回はOS X向けのアプリを作っていこうと思うので、「OS X」→「Application」→「Cocoa Application」という風にクリックしていきます。
Xcode12

では、そのプロジェクトの情報などを入力していきます。
Product Nameは作るアプリの名前、Organization Nameは組織名、Organization Identifierはドメイン持ってる人は逆さまにして書いておくといいと思います。
Rは組織じゃないけど、とりあえず、Organization NameにIt is Rと入れました。
また、今回のアプリはSwiftを使おうと思うので、LangageはSwiftにします。また、Storyboardを使いたいので、「Use Storyboards」にチェックを入れます。
Xcode13

Nextをクリックするします。これで新しいプロジェクトが完成しました。

設定変更

開かれたウィンドウから、Deployment infoを探し、Deployment Targetを10.10に変更します。
こうすることで、OS X Yosemiteでも、作ったアプリが使用できる状態になります。

Deployment info

Storyboardについて

Storyboardでは、実際にウィンドウを見るイメージで、視覚的にアプリを作ることができます。

Storyboardを開く

まずはStoryboardを開きます。
ウィンドウ左側のTestAppの中、またTestAppの中のMain.storyboardをクリックします。
Xcode16

もしも左側にファイルの一覧(プロジェクトナビゲータ)が表示されていない場合は、ウィンドウ右上にそれを表示する、次の様なアイコンがあります。これをクリックしてください。
Xcode17

ではこれを実行してみましょう。ウィンドウ左上の▶︎をクリックします。
すると、何も描かれていませんが、ウィンドウが表示されます。
Xcode18

確認したら、▶︎の隣にある■をクリックしておきます。

ウィンドウに文字を表示する

それでは、このウィンドウに文字を表示してみます。
まず下の画像の様に2箇所クリックし、Labelと検索します。
Xcode19

ではウィンドウ右下(ライブラリ)に表示されたLabelを、Storyboard内の二つのウィンドウのうち、下側のウィンドウにドラッグします。
Xcode20

実行すると、ウィンドウにLabelと表示されます。
Xcode21

文字を編集したい時は、Labelと書かれた文字列をダブルクリックすることで編集できます。
Xcode22

プログラムで文字を編集することも可能ですが、次回以降の記事でやっていこうと思います。

スポンサードリンク

おすすめの記事♪

Mac

Macで外付けHDDをフォーマットする超簡単な方法。

「あの夕陽に向かって走ろう」 とか言っている熱血教師は、だいたい何mぐらい走[email protected]_is_Rです。 今回はMacに標準で付属しているソフトのみで、外付けのHDD

Mac

【超簡単】Time MachineでMac全体のバックアップを取る方法!!

Macユーザーの皆さんこんにちわ。禍福は糾える縄の如しと言いますが、縄というよりも毛糸のよう[email protected]_is_Rです。 糸は簡単に解け、幸福の道を歩む人と、不幸の道を歩む人に分かれます。そ

ピクチャ・イン・ピクチャ

ピクチャ・イン・ピクチャが絵の練習に超便利でヤバスな件について。

ピクチャ・イン・ピクチャでイラストの練習して[email protected]_is_Rです。 macOS Sierra のピクチャ・イン・ピクチャが、イラストの練習に超便利でヤバスなので、紹介させていただこうと思

Android Studio でエミュレータを起動してプログラムを実行する方法!

[email protected]_is_Rです。 このままでは人生さえも長続きしないかも知れない。 さて、しばらくぶりになってしまいましたが、今回は Android Studio 2.3.2 を

宇宙一分かりやすい JavaScript のかなり詳しい基本の解説。

宇宙一分かりやすい JavaScript のかなり詳しい基本の解説。

[email protected]_is_Rです。 今回は JavaScript について、初心者の人にも分かりやすく、丁寧に解説していきます。 JavaScript と EcmaSc

Android Studio で新規プロジェクトを作成する方法。

インスタント焼きそばを作ろうとすると、なぜか焼うどんになります。 @It_is_R です。 しかも、ラーメン作ろうと思うと焼きそばができあがります。 前回、 Android Studio のイ

software

StartNinjaで超簡単にMacの起動音を消す方法。

ダメと言われるとやりたくなる。良いよって言わ[email protected]_is_Rです。 Macを起動する時、「ジャーン!!」という音がなりますよね。なんかこの音、ちょっと良いけど、たかが知れてる

ピクチャ・イン・ピクチャ

macOS Sierra – ピクチャ・イン・ピクチャの使い方 & 好きな場所へ配置する方法。

[email protected]_is_Rです。 macOS Sierra の新機能、 ピクチャ・イン・ピクチャ をご存知でしょうか? ピクチャ・イン・ピクチャ は、何らかの作業

SiriがmacOS Sierraで!!Twitter投稿や男性ボイス設定など使い方!

[email protected]_is_Rです。 macOS Sierra の自動ダウンロードが開始しましたね。 なんと、今回の新OSには、 Siri が使える様になっております。 そこで今回は

Mac

みんなが使う共有PC(Mac)でイタズラしようぜ!!

[email protected]_is_Rです。 みなさま、イタズラは好きですか?困っている人を見るのは楽しいですか? そんなあなたにぴったりな記事を書きます。題して、「みんなが使う共有PC


コメントをどうぞ!

メールアドレスが公開されることはありません。




Category

Games