Author Topic: Fade in a modal  (Read 2056 times)

Jordy

  • Newbie
  • *
  • Thank You
  • -Given: 0
  • -Receive: 0
  • Posts: 4
    • View Profile
Fade in a modal
« on: December 29, 2016, 05:54:34 PM »
I just started learning NGUI. Now I have the following Hierarchy:

- UI Root
|-- Camera
|-- Panel
|-- |-- Main
|-- |-- |-- Button Settings
|-- |-- |-- Button Ranking
|-- |-- Settings MODAL
|-- |-- |-- Control - Background
|-- |-- |-- Control - Simple Text
|-- |-- Ranking MODAL
|-- |-- |-- Control - Background
|-- |-- |-- Control - Simple Text

I have three questions about this:

  • Is this the right way to set up my hierarchy? I want to stay with one panel to keep the performance on its best
  • The Button Settings should fade in the Settings Modal and the Button Ranking should fade in the Ranking Modal. What is the best way to set this up? I can't figure out what would be the best way. The background should be faded in, the other controls (like the text) shoudl have another cool effect.
  • The background is a black overlay on top of the game. As mentioned, aach time a modal is opened, this background should fade in. But, there could be a lot more modals (8 or so). Should I duplicate the background for each of this modal. Or can I have one instance of the background?

ArenMook

  • Administrator
  • Hero Member
  • *****
  • Thank You
  • -Given: 337
  • -Receive: 1171
  • Posts: 22,128
  • Toronto, Canada
    • View Profile
Re: Fade in a modal
« Reply #1 on: December 31, 2016, 07:41:56 AM »
1. It's actually often better to have multiple panels. Moving panels around is much more efficient than moving widgets around. I always recommend the "one panel per window" rule.

2. Put a TweenAlpha on the settings and rankings widget/panel. Use PlayTween on the button in order to move it in -- that's one option. A better option is to download the Starlink UI kit and use the UIWindow code from there. It's designed to fade in windows (panels), keeping history of them in the process in order for you to be able to click a "back" button. Use the UIWindowButton script.

3. That's really up to you.

Jordy

  • Newbie
  • *
  • Thank You
  • -Given: 0
  • -Receive: 0
  • Posts: 4
    • View Profile
Re: Fade in a modal
« Reply #2 on: December 31, 2016, 11:26:02 AM »
1. It's actually often better to have multiple panels. Moving panels around is much more efficient than moving widgets around. I always recommend the "one panel per window" rule.

Thank you, but isn't each panel an extra draw call? Shouldn't I minimize the amount of panels when developing for mobile phones?

ArenMook

  • Administrator
  • Hero Member
  • *****
  • Thank You
  • -Given: 337
  • -Receive: 1171
  • Posts: 22,128
  • Toronto, Canada
    • View Profile
Re: Fade in a modal
« Reply #3 on: January 04, 2017, 09:43:56 AM »
Yes, each panel is a separate draw call. As I said though, one window = one panel rule should keep it fairly low, unless you expect to have many windows open at the same time. Inactive windows don't contribute draw calls.