iPhone ひらがな練習アプリ

?には、どんな「ひらがな」がかくれているかな?あいうえおかきくけこの中から選んでみてね。「あ」の右が?なら「い」、「す」の左が?なら「し」が答えだよ! という感じで平仮名50音の穴埋めアプリの作り方を書いてみました。


動作イメージ
XcodeからiOS6 iPhone Simulatorで動かすとこんな感じになります。


ポイント
あ行、か行、さ行の計15文字の中から、9文字を表示してそのうちの一つを?マークで隠してみました。選ぶ選択肢は、画面下部にUIScrollViewとして配置しています。正解した後は、一度全てのViewを新しいにのせて、その下に新しい問題を表示したあと、上方向に流しています。

サンプルコード

#import “ViewController.h”

#import <QuartzCore/QuartzCore.h>

@interface ViewController () {

    int hatenaNo;

    NSString *hatenaWord;

}

@end

@implementation ViewController

– (void)viewDidLoad

{

    [super viewDidLoad];

    self.view.backgroundColor = [UIColor orangeColor];

    

    [self showMatrix];

    [self showAlternatives];

}

#define WORDS [@ componentsSeparatedByString:@” “]

– (void)showMatrix

{

    

    // あ行、か行、さ行

    NSArray *words = WORDS;

    

    // どこを3×3の中心にするか「きくけ」のどれか

    int center = arc4random() % 3;

    

    // 3×3の9マスに8文字とはてなを表示

    for (int i=0; i<9; i++) {

        float x = (i % 3) * 100 + 10;

        float y = (i / 3) * 100 + 10;

        UILabel *kana = [[UILabel alloc] initWithFrame:CGRectMake(x, y, 90, 90)];

        kana.font = [UIFont systemFontOfSize:90];

        kana.textAlignment = 1;

        kana.textColor = self.view.backgroundColor;

        

        // 文字をチョイス

        int index = center + (i / 3) * 5 + (i % 3);

        kana.text = [words objectAtIndex:index];

        [self.view addSubview:kana];

        

        kana.tag = i + 1;

    }

    

    // はてなを決める

    hatenaNo = arc4random() % 9 + 1;

    UILabel *q = (UILabel*)[self.view viewWithTag:hatenaNo];

    hatenaWord = q.text;

    q.text = @”?”;

    

}

– (void)showAlternatives

{

    UIScrollView *scv = [[UIScrollView alloc] initWithFrame:CGRectMake(0, 380, 320, 60)];

    scv.contentSize = CGSizeMake(50 * 15, 60);

    scv.backgroundColor = [UIColor clearColor];

    [self.view addSubview:scv];

    

    NSArray *words = WORDS;

    for (int i=0; i<[words count]; i++) {

        UILabel *kana = [[UILabel alloc] initWithFrame:CGRectMake(i * 50, 5, 50, 50)];

        kana.font = [UIFont systemFontOfSize:45];

        kana.textAlignment = 1;

        kana.textColor = [UIColor whiteColor];

        kana.backgroundColor = [UIColor orangeColor];

        kana.text = [words objectAtIndex:i];

        [scv addSubview:kana];

        

        kana.userInteractionEnabled = YES;

        UITapGestureRecognizer *tap = [[UITapGestureRecognizer alloc] initWithTarget:self action:@selector(tap:)];

        [kana addGestureRecognizer:tap];

    }

}

– (void)tap:(UITapGestureRecognizer*)gr

{

    [UIView animateWithDuration:0.1 animations:^{

        gr.view.transform = CGAffineTransformMakeScale(1.2, 1.2);

    } completion:^(BOOL finished) {

        [UIView animateWithDuration:0.3 animations:^{

            gr.view.transform = CGAffineTransformMakeScale(1, 1);

        }];

    }];

    

    

    if ([hatenaWord isEqualToString:((UILabel*)gr.view).text]) {

        UILabel *h = (UILabel*)[self.view viewWithTag:hatenaNo];

        

        [UIView animateWithDuration:0.2 animations:^{

            h.layer.transform = CATransform3DMakeRotation(M_PI/2.0, 1,0,0);

        } completion:^(BOOL finished) {

            h.text = ((UILabel*)gr.view).text;

            [UIView animateWithDuration:0.2 animations:^{

                h.layer.transform = CATransform3DRotate(h.layer.transform, – M_PI/2.0, 1, 0, 0);

            } completion:^(BOOL finished) {

                [self nextQuestion];

            }];

        }];

    }

}

– (void)nextQuestion {

    

    UIView *tray = [[UIView alloc] initWithFrame:self.view.bounds];

    tray.backgroundColor = [UIColor orangeColor];

    for (UIView *sub in self.view.subviews) {

        [tray addSubview:sub];

    }

    

    // new question under tray

    [self showMatrix];

    [self showAlternatives];

    

    

    // old views –> tray

    [self.view addSubview:tray];

    

    [UIView animateWithDuration:0.5 animations:^{

        tray.transform = CGAffineTransformMakeTranslation(0, –520);

    } completion:^(BOOL finished) {

        for (UIView *sub in tray.subviews) {

            [sub removeFromSuperview];

        }

        [tray removeFromSuperview];

    }];

    

}

– (void)didReceiveMemoryWarning

{

    [super didReceiveMemoryWarning];

    // Dispose of any resources that can be recreated.

}

@end