Using Layers Tutorial 1.0

Home Forums Development Other stuff Using Layers Tutorial 1.0

Tagged: ,

Viewing 20 posts - 1 through 20 (of 20 total)
  • Author
    Posts
  • #120250
    dnaldoog
    Participant
      • Topics: 4
      • Replies: 480
      • Total: 484
      • ★★

      How to use layers in a panel.

      Layers are very useful for stacking different interfaces and controls independent of each other or for use as a backdrop/background for a layer above it.

      [1] To create a new layer:
      MENU (Panel -> Layer Editor -> Edit -> Add Layer)

      [2] Rename the layer by double clicking on the name and optionally set a background colour by right clicking on the default background ARGB 00000000 (this is black with opacity set to 0)

      [3] To hide a layer or show a layer when the program is run, I prefer to create a lua table of layer names. This table could be global or local to the change_layer() function.

      layers={"A","B","C"}
      Here I have three layers, each named unhelpfully A,B and C

      [4] Create a function:

      
      change_layer=function(selected)
      for _,v in ipairs(layers) do
      panel:getCanvas():getLayerByName(v):setVisible(false)
      end -- loop
      panel:getCanvas():getLayerByName(selected+1):setVisible(true)
      end --function
      

      [5] Create a callback function in for example a uiCombo:

      
      select = function(--[[ CtrlrModulator --]] mod, --[[ number --]] value, --[[ number --]] source)
      change_layer(value) 
      end
      

      Notes::

      When a selection is made, in this case using uiCombo, a function call is made to change_layer(selection) function. The selected Index of the uiCombo is passed into the function. uiCombo Indexes start at 0, but lua tables start at 1 so we have to increment by 1 in the function.

      In that function a loop runs through and sets all layers to not visible. After the loop is finished, the layer in the ‘layers’ table in a position corresponding to the selected value is set to visible.

      The top visible layer is the only layer that is editable. To edit other layers, hide layers sitting above the layer by clicking on the ‘eye’ icon or temporarily move down a layer you want to edit (meaning it is at the top!) edit -> move down (or move up).

      You can create uiSliders and other components in any layer and move them to another layer by right clicking on the modulator: send to layer

      See attached example panel.

      • This topic was modified 3 years, 5 months ago by dnaldoog. Reason: more editing
      • This topic was modified 2 years, 7 months ago by dnaldoog. Reason: added increment to variable selected (it is correct in the panel code)
      Attachments:
      You must be logged in to view attached files.
      #120262
      Tedjuh
      Participant
        • Topics: 9
        • Replies: 97
        • Total: 106
        • ★★

        Nice work, Dnaldoog. Easy to follow and transparent explanation.

        — Rant mode on —

        I don’t know who maintains the Ctrlr site or who is a moderator at this forum. But isn’t it a good idea to make a category for manuals? Because those “manuals” are a very valuable source on how to get things done in Ctrlr. I know a lot of answers can be found on the forum and inside panels but it doesn’t make searching for an answer to a particular problem that much easier.

        For example: If I had known earlier on that it’s good practice to do:
        modulatorNamedSomething = panel:getModulatorByName(“modulatorName”)
        in a init file, and then later call it with
        modulatorNamedSomething:getProperty(“property”)
        it would have saved me an amount of time going over all my Lua files again.

        Hell, I wish I knew how LookAndFeel works because the Demo file doesn’t work for me. How to start with a
        Custom Component? How do you add children to a parent component? How to make a librarian? So many questions but not easy to find an answer for it.

        I would even like to contribute as I did with the manual on how to compile Ctrlr. Goodweather made a manual once but it’s somewhere at page 65. Dnaldoog knows his stuff and writes easy to understand manuals as well like above. Let’s make life easier. Let’s see what open-source is really about.

        — Rant Mode Off —

        #120269
        spiffo
        Participant
          • Topics: 12
          • Replies: 38
          • Total: 50

          Mmmmmm, that’s interesting I was solving this particular problem by using uiGroup Modulators on top of each other and then just setting them to visible / invisible like this:

          panel:getModulatorByName(“plate_reverb_group”):getComponent():setVisible(false)
          panel:getModulatorByName(“chamber_reverb_group”):getComponent():setVisible(true)
          panel:getModulatorByName(“infinite_reverb_group”):getComponent():setVisible(false)

          So what is the killer advantage of using Layers then?
          I mean what am I missing out on?

          #120271
          dnaldoog
          Participant
            • Topics: 4
            • Replies: 480
            • Total: 484
            • ★★

            Hi Spiffo,

            Probably another way of doing it, but then I am not familiar with using uiGroup and Goodweather, who has never used layers but is a veteran, didn’t know how to use layers, so I guess it shows the depth of Ctrlr (and JUCE) – several ways to achieve a similar result!

            My latest panel for the Zoom RFX-2000 uses 15 layers!

            Also, I often have hidden modulators in a hidden layer. That’s pretty useful.

            Regards,

            #120280
            dasfaker
            Keymaster
              • Topics: 80
              • Replies: 793
              • Total: 873
              • ★★★

              I don’t know who maintains the Ctrlr site or who is a moderator at this forum. But isn’t it a good idea to make a category for manuals?

              If someone compile those manuals and give me the links, I’ll upload them in Downloads/Manuals

              #120281
              Tedjuh
              Participant
                • Topics: 9
                • Replies: 97
                • Total: 106
                • ★★

                Will do Dasfaker. Thank you. I’ll start a new topic soon with some links to manuals/ tutorials instead of hijacking this thread. Excusez-moi for that Dnaldoog.

                Back on topic. I prefer layers over tabs. I don’t like the “folder structure” of tabs but that’s more of an aesthetic thing. I think Layers are easier to maintain, as in how to set them up in Ctrlr. The only thing that is kind of a shame is that layers are the “full panel” that is layered. But I think Spiffo has shown that a uiGroup can be handled as a “partial panel layer”. I knew I could set modulators to visible or invisible but never thought about doing it with a uiGroup. Nice!!

                #120362
                spiffo
                Participant
                  • Topics: 12
                  • Replies: 38
                  • Total: 50

                  Mmmmm, I spoke too soon.

                  Placing one uiGroup on top of another one automatically makes the one on top a member of the lower group. So that means that setting the lower uiGroup invisible automatically makes all the other uiGroups on top of it invisible as well. If you set both uiGroups visible then you end up with a jumble of modulators from both groups all visible at the same time, which is not what I was after at all!

                  Removing the ‘Component Generic – Group’ setting or unticking the ‘Is component a member of a group’ doesn’t seem to make any difference. If you have one uiGroup on top of another one then it belongs to the lower group and that’s that!

                  I’m going to take a break and see if any divine inspiration strikes me when I’m doing something else 🙂

                  #120363
                  dnaldoog
                  Participant
                    • Topics: 4
                    • Replies: 480
                    • Total: 484
                    • ★★

                    I probably tried all that at some point and found it very frustrating – Stuff getting jumbled around lost – it is much harder than layers – once you get used to using layers, you will never look back! ?

                    #120368
                    spiffo
                    Participant
                      • Topics: 12
                      • Replies: 38
                      • Total: 50

                      OK, after more testing, please find attached 2 Test Panels, one with uiGroups on top of one another and another with uiTabs

                      It is definitely possible to layer (for want of a better word) Tabs and Groups on top of one another and then make selective ones Visible / Invisible.

                      I was struggling with my PCM80 Panel but doing things in the following order seems to work:

                      1 Delete any text from the ‘Component Generic – Group’ entry
                      2 Un-Tick the ‘is component a member of a group’, the uiGroup will leap to the 0,0 position on the Panel
                      3 Drag the uiGroup back down to it’s original position
                      4 Check that in the Component Generic section that there is nothing in the ‘Group’ entry and ‘is component a member of a group’ is stil un-ticked

                      At the moment that is working, I can put 4 uiGroups in the same physical place on the Panel and make only one visible at any one time.

                      Attachments:
                      You must be logged in to view attached files.
                      #120371
                      dnaldoog
                      Participant
                        • Topics: 4
                        • Replies: 480
                        • Total: 484
                        • ★★

                        Thanks for that Spiffo!

                        Something weird going on with that Tabs-Experiment panel though.

                        When you first open it, there’s a tab group inside another one, but when you click on the comboBox it disappears forever!

                        #120372
                        spiffo
                        Participant
                          • Topics: 12
                          • Replies: 38
                          • Total: 50

                          Strange, I just opened it there and it works fine for me!

                          I’ve noticed that with the uiGroups you have to be careful not to accidently move one that’s on top of another because if you do it gets automatically assigned to the lower group again and the whole thing stops working again 🙁

                          Basically you’re right, probably better off with layers, with that in mind, some questions:

                          1 When in Layer Editor the Layer listed at the bottom is the only one you can Edit, is that the only consequence of the list order?
                          2 Does a Layer always cover the entire area of the Panel, with you’re example they seem to?
                          3 If I used layers then personally I would want certain areas of the Panel to remain unaffected whilst other localised areas changed layers depending on something else, is that possible?

                          • This reply was modified 3 years, 5 months ago by spiffo.
                          #120374
                          spiffo
                          Participant
                            • Topics: 12
                            • Replies: 38
                            • Total: 50

                            OK I’ll answer some of this myself, please find attached a Layers Experiment.

                            The Order of the Layers is important even when not in Edit Mode, as it affects what is Visible and what is NOT Visible.

                            As far as I can work out, Layers at the bottom of the Layer Editor window are in the Foreground and Layers at the top of the list are in the Background, so if you have Modulators in the same physical X, Y space then you need to make sure that any modulator which needs to be visible on top of another is lower down in the list, closer to the Foreground if you will, or it could get hidden behind!

                            For instance with this panel attached if you move Layers 3 or 4 up higher in the list than Layers 1 and 2 then they end up getting hidden behind the tabs (which are on Layers 1 and 2).

                            Attachments:
                            You must be logged in to view attached files.
                            #120376
                            dnaldoog
                            Participant
                              • Topics: 4
                              • Replies: 480
                              • Total: 484
                              • ★★

                              Hi Spiffo,

                              That’s right – a layer covers the whole panel, but if a component is not covered by another object in a layer above it, it can be accessed, so with a bit of design, so it’s actually a very useful feature.

                              Also, in those if else statements, that last else is not necessary.

                              function switch_tab_contents()

                              mod1 = panel:getModulatorByName(“modulator-2”):getModulatorValue()

                              if mod1 == 0 then

                              panel:getCanvas():getLayerByName(“Layer3”):setVisible(true)
                              panel:getCanvas():getLayerByName(“Layer4”):setVisible(false)

                              elseif mod1 == 1 then

                              panel:getCanvas():getLayerByName(“Layer3”):setVisible(false)
                              panel:getCanvas():getLayerByName(“Layer4”):setVisible(true)

                              else end
                              end — function

                              • This reply was modified 3 years, 5 months ago by dnaldoog.
                              • This reply was modified 3 years, 5 months ago by dnaldoog.
                              #120389
                              spiffo
                              Participant
                                • Topics: 12
                                • Replies: 38
                                • Total: 50

                                OK, thanks dnaldoog, I think I have my head around it now.

                                I’m off to give it a go on the PCM80 Panel I have on the go at the moment.

                                • This reply was modified 3 years, 5 months ago by spiffo.
                                #120391
                                dnaldoog
                                Participant
                                  • Topics: 4
                                  • Replies: 480
                                  • Total: 484
                                  • ★★

                                  Great Spiffo!

                                  See this panel for an example of layers ctrlr.org/zoom-rfx-2000-editor/

                                  If you click on the EXTRA button each selection from the combo is a separate layer with the top section always visible in a top layer.

                                  Regards,

                                  #120407
                                  dnaldoog
                                  Participant
                                    • Topics: 4
                                    • Replies: 480
                                    • Total: 484
                                    • ★★

                                    Hey Spiffo,

                                    here’s another simple panel that uses layers. I posted it here
                                    https://ctrlr.org/forums/topic/did-i-mess-up-my-panel-size/

                                    but will attach it here again.

                                    Attachments:
                                    You must be logged in to view attached files.
                                    #120448
                                    goodweather
                                    Participant
                                      • Topics: 45
                                      • Replies: 550
                                      • Total: 595
                                      • ★★★

                                      Excellent thread and discussion.
                                      Thx a lot dnaldoog!!!
                                      If OK for you, I add this info in my ever expending and never ending Step by Step guide (I continued filling it and revising it even if only published the 1.x version)

                                      #120452
                                      dnaldoog
                                      Participant
                                        • Topics: 4
                                        • Replies: 480
                                        • Total: 484
                                        • ★★

                                        Hi Goodweather,

                                        By all means – that would be fantastic, otherwise the post will eventually get buried with all the other posts as time goes on! I plan to do a few of these eventually, especially for subjects that keep popping up on the forums.

                                        Thank you!

                                        #121174
                                        BAUS
                                        Participant
                                          • Topics: 2
                                          • Replies: 22
                                          • Total: 24

                                          I have started working with layers in my next panel and it is less frustrating.

                                          Layer 9 is a static layer supplying the ‘graphics’ or lay-out of the panel. I still used groups to create that but in this case a group only holds a small number of larger elements instead of all the modulators.

                                          Layer 1 holds all the modulators and it is such a relief to just be able to move them around freely without them (or a whole group) dissappearing somewhere. I am copying all the locations/positions of the modulators into an excel sheet so I can easily copy them to Layers 2 to 8 later on. If there’s an easier/smarter way to do this the please let me know.

                                          On this panel I can see static layer with an other layer on top of it. If layer 1 is selected in the layer editor I see the modulator values of layer 1, if layer 2 is selected I can see the values of layer 2.

                                          However in the first panel for the Mirage that I am still working on this is not the case. I moved a whole group to (in this case) layer 2 and when I choose layer 1 only layer 1 appears. Then when I choose layer 2, layer 2 pops up while layer 1 also stays on-screen.

                                          There are no overlapping groups/modulators.

                                          What I want basically is both layers to be visible but only 1 layer should be editable at a time. What am I overlooking here?

                                          Thanks in advance,

                                          Robin.

                                          Updating a 25 year old Editor

                                          #121193
                                          dnaldoog
                                          Participant
                                            • Topics: 4
                                            • Replies: 480
                                            • Total: 484
                                            • ★★

                                            Hi Baus,

                                            Not sure if I understand, but if you want one layer sitting under another layer to be editable there must be no objects in the top layer directly above that control you want the user to change. If there is nothing in the layer above obstructing those controls then those controls in the bottom layer should be accessible.

                                          Viewing 20 posts - 1 through 20 (of 20 total)
                                          • You must be logged in to reply to this topic.
                                          There is currently 0 users and 48 guests online
                                          No users are currently active
                                          Forum Statistics
                                          Threads: 2,495, Posts: 17,374, Members: 77,605
                                          Most users ever online was 12 on January 22, 2019 3:47 pm
                                          Ctrlr