Mobileアプリ開発のお勉強の近況記録

Mobileアプリ開発をしようかと思い立つ。その近況を後で見返したくなるかも知れないので記録。

性能の要求は低いので、WebViewアプリにすることにしよう。 Mobileアプリ向けのFrameworkは幾つかあるけど、とりあえずionicでやってみよう。 Ionic: Advanced HTML5 Hybrid Mobile App Framework

ionicのGetting Startedをやってみる。 ionicframework.com

自動生成されるソースを眺めて、こりゃAngulrajsが分からないと始まらないぞと悟り、そっちの入門YouTubeを見る。

AngularJS For Everyone | Level Up Tutorials

www.youtube.com

github.com

www.youtube.com

自動生成されるソースは、Angulrajsのdirectiveなのかと、何となく当たりがつく。 Getting Startedのtabs templateで生成される、ion-nav-view directiveが分からないと、ionicが使いこなせなさそうだな。 ion-nav-viewのドキュメントはどこだ？（結構、ionicのキーになる概念だと思うけど、ionicのサイトで中心的に取り上げられてないなぁ、いいのかなぁ...） ionicframework.com

そのドキュメントを読んでAngularUI Routerが分からないとまずいぞと思い、そのYouTubeを見る。

github.com

www.youtube.com

tabs templateのabstract: true, の意味がなんとなく分かる。

.config(function($stateProvider, $urlRouterProvider) {

  // Ionic uses AngularUI Router which uses the concept of states
  // Learn more here: https://github.com/angular-ui/ui-router
  // Set up the various states which the app can be in.
  // Each state's controller can be found in controllers.js
  $stateProvider

  // setup an abstract state for the tabs directive
    .state('tab', {
    url: '/tab',
    abstract: true,
    templateUrl: 'templates/tabs.html'
  })

  // Each tab has its own nav history stack:

  .state('tab.dash', {
    url: '/dash',
    views: {
      'tab-dash': {
        templateUrl: 'templates/tab-dash.html',
        controller: 'DashCtrl'
      }
    }
  })

そんなところです。