ハイパーいわんのブログ一覧

前回の続きです。

計算というボタンを押すと燃費計算をさせたいのでこのアクションを作成します。
つまり走行距離／給油量＝燃費という計算をさせます。

これはMainStoryboard.storyboardから作成可能です。
右上のEditorというところのアイコンの真ん中にAssistant Editorといのが
ありますのでこれを押してソースファイルを開きます。（FuelViewConrtroller.h）

ViewControllerの計算ボタンをcontrolボタンを押しながらマウスで
@interface ～@endの間にドラッグします。

すると画面のようなポップアップメニューが現れます。
connection Action
Object Fuel View Controller
Name calc:
Type id
Event Touch Up Inside
Arguments Sender
としてconnectボタンを押します。

#import

@interface FuelViewController : UIViewController
- (IBAction)calc:(id)sender;

@end

となっているはずです。

なおFuelViewController.mには
- (IBAction)calc:(id)sender {
}
@end

が追加されています。

以上で計算ボタンとViewControllerを接続完了です。

次に走行距離と給油量のテキストフィールドと燃費というラベル間の関係を接続します。
他のKm、L、Km/Lは単なるラベルなので特に接続は必要ありません。

ボタンの接続と同様にまずは距離を入力するテキストフィールドをcontrolボタンを押しながら
@interface ～@endの間にドラッグします。

ポップアップメニューが現れますので

connection Outlet
Object Fuel View Controller
Name kyori
Type UITextField
Storage Weak
としてconnectボタンを押します。

同様に給油量を入力するテキストフィールドをドラッグします。

#import

@interface FuelViewController : UIViewController
@property (weak, nonatomic) IBOutlet UITextField *kyori;
@property (weak, nonatomic) IBOutlet UITextField *gas;
- (IBAction)calc:(id)sender;

@end

こんな感じになっているはずです。
なおFuelViewController.mには
@implementation FuelViewController
@synthesize kyori;
@synthesize gas;
が追加されています。

燃費というラベルの接続に取りかかります。
controlボタンを押しながら
@interface ～@endの間にドラッグします。
ポップアップメニューが現れますので

connection Outlet
Object Fuel View Controller
Name nenpi
Type UILabel
Storage Weak
としてconnectボタンを押します。

#import

@interface FuelViewController : UIViewController
@property (weak, nonatomic) IBOutlet UITextField *kyori;
@property (weak, nonatomic) IBOutlet UITextField *gas;
@property (weak, nonatomic) IBOutlet UILabel *nenpi;
- (IBAction)calc:(id)sender;

@end

こんな感じになっているはずです。

なおFuelViewController.mには
@implementation FuelViewController
@synthesize kyori;
@synthesize gas;
@synthesize nenpi;

となっているはずです。

次に行う事は走行距離と給油量のテキストフィールドをデリゲート接続を作成です。
またまた聞き慣れない「デリゲート」という言葉が出てきました。
後日この辺りはまとめようと思いますがとりあえず今の動作で言えば走行距離と給油量を
読み込んで燃費を計算させるためのものです。

言葉では難しいのですがXcodeではマウスのドラッグで作成できます。

FuelViewControllerSceneというのがリスト形式でありますのでここのTextFieldを
Viewの下の方のバーにある右側の黄色の円の中へcontrolを押しながらドラッグします。
kyoriとkyuuyuどちらとも行います。
なお黄色い円はViewControllerオブジェクトを表します。

ポップアップメニューがそれぞれ出てきますのでObjectsのdelegateにチェックを入れます。

さて次はいよいよ燃費計算結果を表示するプロパティを追加します。
ここからがちょっとソースコードを書かなければならないので難易度がやや上がります。
しっかりとマスターしましょう。

そして随分前に設定した燃費というラベルにcalc:というアクションを実装したかと思います。
このcalc:というアクションは走行距離と給油量をTextFieldから文字列を取得して
燃費の計算（燃費＝走行距離/給油量）の結果を燃費というラベルに表示させるものです。
いよいよ最終仕上げです！

FuelViewController.mの中に
- (IBAction)calc:(id)sender {
}
という所があります。ここへ計算する式を記述します。

- (IBAction)calc:(id)sender {
double kyoridata=[[kyori text] intValue];//走行距離を取得
double gasdata = [[kyuuyu text] intValue];//給油量を取得
double nenpiD=kyoridata/gasdata;//燃費を計算

[nenpi setText:[NSString stringWithFormat:@"%1.2f", nenpiD]];//計算結果を燃費ラベルに表示する。

}

後はシュミレーターを走らせてみましょう。


やったー！完成です。

ちょっとソースコードを手修正した箇所があるので
FuelViewController.h
FuelViewController.m
のコードを下記へ記述します。

FuelViewController.h
#import

@interface FuelViewController : UIViewController
@property (weak, nonatomic) IBOutlet UITextField *kyuuyu;
@property (weak, nonatomic) IBOutlet UILabel *nenpi;
@property (weak, nonatomic) IBOutlet UITextField *kyori;
- (IBAction)calc:(id)sender;
@end

FuelViewController.m
#import "FuelViewController.h"

@interface FuelViewController ()

@end

@implementation FuelViewController
@synthesize kyuuyu;
@synthesize nenpi;
@synthesize kyori;

- (void)viewDidLoad
{
[super viewDidLoad];
// Do any additional setup after loading the view, typically from a nib.
}

- (void)viewDidUnload
{
[self setKyori:nil];
[self setKyuuyu:nil];
[self setNenpi:nil];
[super viewDidUnload];
// Release any retained subviews of the main view.
}

- (BOOL)shouldAutorotateToInterfaceOrientation:(UIInterfaceOrientation)interfaceOrientation
{
return (interfaceOrientation != UIInterfaceOrientationPortraitUpsideDown);
}

- (IBAction)calc:(id)sender {
double kyoridata=[[kyori text] intValue];
double gasdata = [[kyuuyu text] intValue];
double nenpiD=kyoridata/gasdata;

[nenpi setText:[NSString stringWithFormat:@"%1.2f", nenpiD]];
}
@end

これでiPhoneアプリ開発奮闘記の第3章の幕を閉じます。

次の奮闘記はこのコードを元にちょっと難易度を上げたアプリを開発してAppstoreに申請したら書きたいと思いますので気長に待ってください(>_<) ○|￣|_

前回のつづきです。

まずはSingleViewApplicationを選択します。
これは画面一つで動作するアプリです。
他のアプリに関しては覚えてからアップします（汗）


Productnameは分かりやすい名前を適当につけます。
CompanyIdentifierはこれも個人の場合は適当につけます。
実際にはapp申請する際にサポートが必須でサポートするURLをひっくり返した形に
なるのが理想なようです。私の場合はまだ決まってないのでとりあえずhyperiwanにしています。
もちろん後で変更も可能です。
ClassFixは後から出てくる自動生成されるクラス名の接頭語になります。
クラスというのはオブジェクト指向言語のひな形を定義したものです。
Xcodeで開発するのならばあまり意識しなくてもいいのではと勝手に思っています。

DeviceFamilyはもちろんiPhoneを選択します。
Use StoryboardsとUse Automatic Reference Countingはチェックして
Include Unit Testsはチェックをオフします。

Nextで次の画面にうつります。



プロジェクトファイルの保存場所を聞かれてきますのでとりあえずデスクトップにします。


まずはアプリの背景色を変えてみます。


デフォルトのホワイトでもいいのですが個人的にはブラックが好きなので背景を
ブラックにします。
MainStoryboard.storyboardをクリックすると真ん中のEtitorAreaにキャンバスと
呼ばれる方眼紙の画面とSceneと呼ばれるiPhoneの画面の元となるNenpiViewControllerが
現れます。
右側にUtilityAreaがあってInspectorBarと呼ばれるものがあります。
左から
・File Inspector
・Quick Help Inspector
・Identity Inspector
・Arttributes Inspector
・Sizes Inspector
・Connection Inspector
があります。

背景の色を変更するにはArttributes Inspectorを選択してBackGroundから
背景色を選択します。
ここで一度iPhoneシミュレータを走らせてみたいと思います。


左上の方にある▶Runを押してみてください。
iPhoneシミュレータが起動して下記画面となります。
黒の背景であればOKです。


次にUI（ユーザインターフェース）のオブジェクトを配置します。
右下のObjectsから今回使うTextField、labelを下記の様にマウスでドラッグして配置します。


それぞれの名前やPlaceHolderを定義します。
TextFieldは走行距離やガソリン給油量を数字で入力しますので
KeyboardのタイプをNumbers and Punctuationにします。
Numbersだと小数点の入力ができないのでこちらを選択しました。



TextField、labelの名前をこんな風に変更します。


そして燃費計算を行う実行ボタンを配置します。


今回はここまでです。

つづく

先週の土曜日からMacと格闘しながらiPhoneアプリの開発を夢見て勉強中です。

まずはMacのマウスには慣れが必要です。
スクロールが逆なので・・・
もちろんwindowsと合わすこともできますがトラックパッドの事を考えると
トラックパッド優先設定の方が便利です。
このトラックバッドはよくできていますね！
仮想デスクトップの移動が４本指スワイプで可能なのでノートの画面でも
十分作業ができます。
徐々に操作も覚えてきました。

そして肝心のiPhoneアプリ開発の方ですがまず準備するものを紹介します。

・Mac機（IntelCPU）
・Mac OS X v10.5（Leopard）以降
このマシンにまずはiOS SDK(SoftwareDevelopmentKit)をインストールします。
アップルのiPhone開発者向けWebサイトで配布されていますのでAppleIDを取得して
ダウンロードします。

Apple Developer Connection （日本語）
http://developer.apple.com/jp/

詳しい事はサーチしてください。（笑）

Xcodeをインストールしてからがいよいよ開発の第一歩になります。

現時点でのバージョンは４．３．３となっています。
これがネットサーチや書籍でもあまり使い方が出てません（汗

まあ経験と勘を頼りにそしてネットでサーチしながら進めていきました。

まずはプロジェクトの新規作成からです。

例として燃費を計算するだけの簡単なアプリの開発を目的とします。


一番上のCreate a new Xcode projectを選択して実行します。

つづく・・・

さすがはAmazonです。
昨晩頼んだMacBook Airがもう届きました。

まずは環境設定からです。

Wi-hi接続OK

でもネットワークNASにつなぐ方法がわからない(><)
顔文字の入力方法がわからない〜

スクリーンキャプチャの方法がわからない〜

前途多難だな・・・

とりあえずF１イギリスGP予選みながら奮闘します(^^;

でもマウスパッドで画面スクロールは簡単です！
３本指使いになりそう(^^;

突然ですがMacBook　Airを買ってしまいました。

1.7GHz Core i5/13.3/4G/128GとBASICな構成です。

目的はiPhone Appの作成です(^^ゞ

ちゃんと出来るかどうかは分かりませんが
チャレンジしたいと思います。

App Storeに出品することが目標です。

果たしてできるのか？？

ちなみにObject-C言語は１から覚えなくてはなりません。
Macも使ったことありません。

しばらくはこのネタが続くかも(^^ゞ


追伸
今回は崖っぷちの命がけです(笑)