質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

ただいまの
回答率

90.48%

  • Xcode

    4210questions

    Xcodeはソフトウェア開発のための、Appleの統合開発環境です。Mac OSXに付随するかたちで配布されています。

  • iOS

    4085questions

    iOSとは、Apple製のスマートフォンであるiPhoneやタブレット端末のiPadに搭載しているオペレーションシステム(OS)です。その他にもiPod touch・Apple TVにも搭載されています。

  • Objective-C

    1198questions

    Objective-Cはオブジェクト指向型のプログラミング言語のひとつです。C言語をベースにSmalltalkが取り入れられています。

  • iPhone

    997questions

    iPhoneとは、アップル社が開発・販売しているスマートフォンです。 同社のデジタルオーディオプレーヤーiPodの機能、電話機能、インターネットやメールなどのWeb通信機能の3つをドッキングした機器です。

  • iPad

    146questions

    iPadは、Appleがデザインしたタブレット型コンピュータです。iPadアプリケーションは通常Xcode IDEのObjective-Cで書かれますが、iPadアプリケーションを組むためのほかのツールを使うことも可能です。

iOSでのサイドメニュー表示

解決済

回答 1

投稿

  • 評価
  • クリップ 0
  • VIEW 2,248

groiag7nj

score 2

教えてgooの方に投稿させて頂きましたが
1週間ほど待っても回答が得られなかったので
改めてこちらで質問させて頂きます。

目的:iOSアプリでサイドメニューの実装
環境:xcode6(つい先日落としました)+Objective-C
スキル:プログラム未経験者

初めましてよろしくお願いします。
サイドメニューというのはFacebookの様な
サイドメニューを表示するタイプ(スライドイン?)ではなく
画面に被せるようなタイプ(スライドオーバー?)を実現したいと思ってます。

関数等を入力して実装できるスキルがないので
コピペから始めたいのですが
調べてみるとスライドインタイプの物が多く
さらにラインセンスが緩いとはいえMITまたはアパッチ付属のものばかりで困っています。

唯一見つけたのが
デジウィキというサイトの『【サンプルコード有】スライドするサイドメニューを表示させる』です。
参考:http://bit.ly/1zczg47
(日本語がURLに含まれ長すぎたので短縮しました。)

『RightSlideMenuView』のhとmファイルは
新規でどの種類を選べばいいのかわからず
(調べた限りxcode4x?5x?では、Object-C classを選んでいるサイトが多く
Objective-C Fileしか存在していない)

新規でxcode⇨SingleViewApplicationを選び
既存のViewControllerを利用して
元ファイルが
@interface RightSlideMenuView : UIView
となっていたので

RightSlideMenuViewを
ViewController

UIViewを
UIViewController
と置き換えてみましたがエラーが出てコンパイルできませんでした。

また参考元の通りUIViewなるものを
一番右のユーティリティーバー下で検索してみましたが
ViewControllerしかなくUIViewというものがありませんでした。

そしてソース元の
RightSlideMenuView.mに記述する所ですが
『//メニュー外をタップしたときに呼び出されるメソッド』
から下のソースは
@implementation RightSlideMenuView
#import "RightSlideMenuView.h"
に書かれているソースとは別枠でソースが書かれていたので
@implementationと#importの最後の締めくくり手前に
それぞれ設置してみましたが相変わらずエラーは解消されませんでした。
外部ファイルに記述する必要があるということでしょうか。

最後になりましたが自分のスキルは
ドットインストールというサイトの
iPhoneアプリ開発入門を一通り終わらした所です。

よろしくお願いします。
  • 気になる質問をクリップする

    クリップした質問は、後からいつでもマイページで確認できます。

    またクリップした質問に回答があった際、通知やメールを受け取ることができます。

    クリップを取り消します

  • 良い質問の評価を上げる

    以下のような質問は評価を上げましょう

    • 質問内容が明確
    • 自分も答えを知りたい
    • 質問者以外のユーザにも役立つ

    評価が高い質問は、TOPページの「注目」タブのフィードに表示されやすくなります。

    質問の評価を上げたことを取り消します

  • 評価を下げられる数の上限に達しました

    評価を下げることができません

    • 1日5回まで評価を下げられます
    • 1日に1ユーザに対して2回まで評価を下げられます

    質問の評価を下げる

    teratailでは下記のような質問を「具体的に困っていることがない質問」、「サイトポリシーに違反する質問」と定義し、推奨していません。

    • プログラミングに関係のない質問
    • やってほしいことだけを記載した丸投げの質問
    • 問題・課題が含まれていない質問
    • 意図的に内容が抹消された質問
    • 広告と受け取られるような投稿

    評価が下がると、TOPページの「アクティブ」「注目」タブのフィードに表示されにくくなります。

    質問の評価を下げたことを取り消します

    この機能は開放されていません

    評価を下げる条件を満たしてません

    評価を下げる理由を選択してください

    詳細な説明はこちら

    上記に当てはまらず、質問内容が明確になっていない質問には「情報の追加・修正依頼」機能からコメントをしてください。

    質問の評価を下げる機能の利用条件

    この機能を利用するためには、以下の事項を行う必要があります。

回答 1

checkベストアンサー

+1

RightSlideMenuViewはUIViewを元にして作るカスタムViewです。
カスタムViewのための新しいクラスを追加する必要があります。

新しいクラスを追加するのは下記の手順で行います。
①New -> File -> iOS SourceのCocoa Touch Class ->Next

下記を入力
Class : RightSlideMenuView
Subclass of : UIView
Language : Objective-C

②できたRightSlideMenuView.hとRightSlideMenuView.mに参考サイトのソースを書き込む

③元からあるViewControllerに参考サイトの「次に、メニューを表示させたいViewControllerをつくります。」以下を記入。

④- (IBAction)showSideMenu:(id)senderの処理を適宜Storyboardに接続する

以上、お試しください^^

投稿

  • 回答の評価を上げる

    以下のような回答は評価を上げましょう

    • 正しい回答
    • わかりやすい回答
    • ためになる回答

    評価が高い回答ほどページの上位に表示されます。

  • 回答の評価を下げる

    下記のような回答は推奨されていません。

    • 間違っている回答
    • 質問の回答になっていない投稿
    • スパムや攻撃的な表現を用いた投稿

    評価を下げる際はその理由を明確に伝え、適切な回答に修正してもらいましょう。

  • 2015/05/05 21:10

    早速の回答ありがとうございます。

    1からプロジェクトを作成してみましたが
    やはりエラーが表示されます。
    まだ使いこなせていないので④の処理を理解できておらず
    それが原因か、または
    ソース元の「//メニュー外をタップしたときに呼び出されるメソッド」の挿入する位置が悪いかのどちらかだと思います。

    現状でソースは
    ◼️ViewController.h
    #import <UIKit/UIKit.h>
    @interface ViewController : UIViewController
    @end

    ◼️ViewController.m
    #import "ViewController.h"
    #import "RightSlideMenuView.h"

    @interface ViewController ()

    @interface MainViewController ()
    {
    RightSlideMenuView* sideMenuView_;
    UIView* viewForClosingSideMenu_;
    }

    @end

    @implementation ViewController

    - (void)viewDidLoad
    {
    [super viewDidLoad];
    sideMenuView_ = [[RightSlideMenuView alloc] initWithFrame: self.view.frame];
    [self.view addSubview: sideMenuView_];
    }

    //スライドさせてメニューを表示させる
    - (IBAction)showSideMenu:(id)sender
    {
    // show side menu with animation
    CGRect sideMenuFrame = sideMenuView_.frame;
    [UIView animateWithDuration:0.3f
    delay:0.0f
    options:UIViewAnimationOptionCurveEaseIn
    animations:^{
    // アニメーションをする処理
    sideMenuView_.frame = CGRectMake( insideSideMenuX,
    sideMenuFrame.origin.y,
    sideMenuFrame.size.width,
    sideMenuFrame.size.height);
    } completion:^(BOOL finished) {
    // アニメーションが終わった後実行する処理
    }];

    // メニュー外をタップしたら、メニューを閉じるようにする
    // そのためのUIViewをメニュー外に設置し、これをタップしたらメニューを閉じるようにする
    if (!viewForClosingSideMenu_)
    {
    viewForClosingSideMenu_ = [[UIView alloc] initWithFrame:
    CGRectMake(0,
    0,
    self.view.frame.size.width
    - sideMenuFrame.size.width,
    self.view.frame.size.height)];
    viewForClosingSideMenu_.backgroundColor = [UIColor clearColor];
    UITapGestureRecognizer *closeSideMenuTap =
    [[UITapGestureRecognizer alloc] initWithTarget:self
    action:@selector(closeSideMenu:)];
    [viewForClosingSideMenu_ addGestureRecognizer:closeSideMenuTap];
    [self.view addSubview: viewForClosingSideMenu_];
    }
    }

    - (void)didReceiveMemoryWarning {
    [super didReceiveMemoryWarning];
    // Dispose of any resources that can be recreated.
    }

    //メニュー外をタップしたときに呼び出されるメソッド
    -(void)closeSideMenu:(int)destination
    {
    CGRect sideMenuFrame = sideMenuView_.frame;
    [UIView animateWithDuration:0.3f
    delay:0.0f
    options:UIViewAnimationOptionCurveEaseIn
    animations:^{
    // アニメーションをする処理
    sideMenuView_.frame = CGRectMake( outsideSideMenuX,
    sideMenuFrame.origin.y,
    sideMenuFrame.size.width,
    sideMenuFrame.size.height);
    } completion:^(BOOL finished) {
    // アニメーションが終わった後実行する処理
    }];

    // メニューを閉じるためのUIViewを削除
    if (viewForClosingSideMenu_)
    {
    [viewForClosingSideMenu_ removeFromSuperview];
    viewForClosingSideMenu_ = nil;
    }
    }
    @end

    ◼️RightSlideMenuView.h
    #import <UIKit/UIKit.h>
    @interface RightSlideMenuView : UIView
    @end

    ◼️RightSlideMenuView.m
    #import "RightSlideMenuView.h"

    @implementation RightSlideMenuView

    - (id)initWithFrame:(CGRect)frame
    {
    self = [super initWithFrame:frame];
    if (self) {
    // Initialization code
    self.frame = CGRectMake( [UIScreen mainScreen].bounds.size.width, 0, 160, 568);
    self.backgroundColor = [UIColor yellowCollor];
    UILabel* title = [[UILabel alloc] initWithFrame:CGRectMake(30, 100, 100, 100)];
    title.text = @"スライドメニューが表示されました";
    title.backgroundColor = [UIColor clearColor];
    }
    return self;
    }

    @end


    となっています。
    再度の質問ですけれど回答を頂けると幸いです。

    よろしくお願いします。
    何故かコメントが反映されていなかったので
    多重投稿になっていたらすみません。

    キャンセル

  • 2015/05/06 00:10

    だいたいOKだと思います。
    あと3箇所直せばいけるはず。

    ①まず元のサイトのミスですが
    RightSlideMenuView.mの[UIColor yellowCollor]の部分が綴りミスなのでyellowColorに直す

    ②IBActionの左側に白抜きの丸印があると思います。StoryboardにButtonを配置してこれと接続してください。
    そうするとボタンを押したときにサイドメニューが表示されるようになります。
    この辺はdotinstallの「ボタンを動作させてみよう」あたりを参考にしてください。

    ③showSideMenuメソッドの中にあるinsideSideMenuXの部分はご自身で数値を入れて調整してみてください。
    同じくcloseSideMenuメソッドの中にあるoutsideSideMenuXの同様です。
    例えばinside~に160、outside~に320を入れるとボタンを押すと右側から半分ほどサイドメニューが出て、メニュー以外のところを押すと元に戻ります。

    キャンセル

  • 2015/05/06 14:55

    回答ありがとうございます。

    結果、無事に動く様になりました。
    大変助かりました。色々とイジりたいと思います。

    この記事を読んでもまだわからない
    自分の様な初心者の方の為に付け足しますと

    ここ間違ってました。
    @interface ViewController ()

    @interface MainViewController ()
    {
    RightSlideMenuView* sideMenuView_;
    UIView* viewForClosingSideMenu_;
    }

    xcode6以降の環境であればデフォルトで
    ViewControllerが作成されているので

    @interface ViewController ()
    {
    RightSlideMenuView* sideMenuView_;
    UIView* viewForClosingSideMenu_;
    }

    正しくは上記です。
    続いて jollyjoesterさんに教えて頂いた
    ②番目のボタンを押した時の反応ですが
    動画を見ても白抜きの丸印と接続できないという人は
    一度、

    - (IBAction)showSideMenu:(id)sender
    の行の上に動画と同じように挿入してください。
    名前は手間を省く為 showSideMenuとすれば
    もうわかると思いますが同じものが2つになっているので
    片方を削りましょう。

    後は③で指摘いただいた具体的な数値を入れる
    ビルドしてください。
    数値を入れてもエラー表示だらけだったのがビルドする事で
    一瞬で消えると思います。

    キャンセル

  • 2015/05/06 15:01

    よかったです^^/

    キャンセル

関連した質問

同じタグがついた質問を見る

  • Xcode

    4210questions

    Xcodeはソフトウェア開発のための、Appleの統合開発環境です。Mac OSXに付随するかたちで配布されています。

  • iOS

    4085questions

    iOSとは、Apple製のスマートフォンであるiPhoneやタブレット端末のiPadに搭載しているオペレーションシステム(OS)です。その他にもiPod touch・Apple TVにも搭載されています。

  • Objective-C

    1198questions

    Objective-Cはオブジェクト指向型のプログラミング言語のひとつです。C言語をベースにSmalltalkが取り入れられています。

  • iPhone

    997questions

    iPhoneとは、アップル社が開発・販売しているスマートフォンです。 同社のデジタルオーディオプレーヤーiPodの機能、電話機能、インターネットやメールなどのWeb通信機能の3つをドッキングした機器です。

  • iPad

    146questions

    iPadは、Appleがデザインしたタブレット型コンピュータです。iPadアプリケーションは通常Xcode IDEのObjective-Cで書かれますが、iPadアプリケーションを組むためのほかのツールを使うことも可能です。