loading...

Jiří Hýsek

nájemný programátor

Jsem ostřílený programátor v Ruby on Rails, mám více než 13 let zkušeností v komerční sféře. Praxe mě naučila dbát na spolehlivost, udržovatelnost a použitelnost. Věřím, že nejlepší řešení je to nejjednodušší.

chcete zrealizovat Váš projekt?

 

Vysouvací menu v RubyMotion

Drawer

V tomto článku ukážu, jak v Rubymotion využít externí knihovnu MMDrawerController, pomocí které se dá snadno vytvořit boční vysouvací menu, které se dá vysunout pomocí gesta. Knihovna umí menu jak vlevo, tak vpravo. A používá se snadno. Trik je jen v tom, že není dokumentace pro RubyMotion, ale pro Objective C. Ale přepis je celkem přímočarý.

Knihovnu připojíme k projektu přes CocoaPods. Proto do Gemfile přidáme pár gemů:

  gem "motion-cocoapods", '~> 1.5.0'
  gem "cocoapods", '~> 0.32.1'
Narazil jsem na komplikaci s nekompatibilními verzemi cocoapods a motion-cocoapods, proto přidávám i verze, se kterými to funguje. Nainstalujeme pomocí bundle install a do Rakefile přidáme pod pro knihovnu MMDrawerController:
  Motion::Project::App.setup do |app|
    ....
    app.pods do
      pod 'MMDrawerController', '~> 0.5.7'
    end
    ....
  end

Pak jen 

pod setup
rake pod:install

a příprava je hotova. 

Menu vlevo nebo vpravo nemusí být jen menu. MMDrawerController na tom místě zobrazi libovolný UIViewController, který mu zadáme. Pro účely tohoto článku vytvořím jen prázdný kontroler s červeným pozadím pro levé menu a modrým pro pravé. Dál je MMDrawerControlleru potřeba zadat kontroler, který má zobrazovat uprostřed.

Takže si nejprve vytvořím v app/controllers tři prázdné kontrollery: left_drawer_controller.rb, right_drawer_controller.rb a main_controller.rb. Vypadají všechny stejně, jen jim měním barvu pozadí.

class LeftDrawerController < UIViewController

  def viewDidLoad
    super
    self.view.backgroundColor=UIColor.redColor
  end

end
RightDrawerController má pozadí barvy UIColor.blueColor a MainController UIColor.whiteColor.

Pak už stačí v app/app_delegate.rb vše inicializovat:

class AppDelegate
  def application(application, didFinishLaunchingWithOptions:launchOptions)
    @window=UIWindow.alloc.initWithFrame(UIScreen.mainScreen.bounds)
    @window.makeKeyAndVisible

    # inicializujeme kontrolery
    leftDrawer =LeftDrawerController.alloc.init
    main       =MainController.alloc.init
    rightDrawer=RightDrawerController.alloc.init

    # main kontroler zabalim do UINavigationControlleru
    nav=UINavigationController.alloc.initWithRootViewController(main)

    # vytvorime drawerController, kteremu predame kontrolery pro menu a pro obsah
    drawerController=MMDrawerController.alloc.initWithCenterViewController(nav,
      leftDrawerViewController: leftDrawer,
      rightDrawerViewController: rightDrawer)

    # zapneme otevirani a zavirani menu gestem
    drawerController.setOpenDrawerGestureModeMask(MMOpenDrawerGestureModeAll)
    drawerController.setCloseDrawerGestureModeMask(MMCloseDrawerGestureModeAll)

    # nastavime drawerController jako hlavni kontroler aplikace
    @window.rootViewController=drawerController

    true
  end
end

No a je to. Spustíme a vidíme, že je možné z levého okraje vysunout červený kontroler, z pravého modrý. Na jejich místo si už můžete dát, co je potřeba, třeba menu, různé statistiky a podobně.

Zdrojové kódy celé aplikace najdete na githubu https://github.com/jhysek/rubymotion-mmdrawercontroller-example.

Zpět na seznam článků