HISE Logo Forum
    • Categories
    • Register
    • Login

    Preset Browser LAF Snippet?

    Scheduled Pinned Locked Moved General Questions
    lafpreset browsersnippethelp
    30 Posts 4 Posters 3.8k Views
    Loading More Posts
    • Oldest to Newest
    • Newest to Oldest
    • Most Votes
    Reply
    • Reply as topic
    Log in to reply
    This topic has been deleted. Only users with topic management privileges can see it.
    • StraticahS
      Straticah @d.healey
      last edited by

      @d-healey the selected would loose the bright accent no?

      creating user interfaces: www.vst-design.com
      founder @prototype.audio https://www.prototype.audio/

      d.healeyD 1 Reply Last reply Reply Quote 0
      • d.healeyD
        d.healey @Straticah
        last edited by

        @Straticah Then I don't understand the issue.

        Free HISE Bootcamp Full Course for beginners.
        YouTube Channel - Public HISE tutorials
        My Patreon - HISE tutorials

        StraticahS 1 Reply Last reply Reply Quote 0
        • StraticahS
          Straticah @d.healey
          last edited by

          @d-healey I want to have the select and deselect tabs having the same size, i guess adding a third rectangle that only shows a purple accent on select and making the dark one the same size as the select button would fix that. :)

          creating user interfaces: www.vst-design.com
          founder @prototype.audio https://www.prototype.audio/

          d.healeyD 1 Reply Last reply Reply Quote 0
          • d.healeyD
            d.healey @Straticah
            last edited by

            @Straticah Yeah you can draw the accent separately, you'll need two rectangles to handle the rounding. One with a curve, one without for the flat side.

            Free HISE Bootcamp Full Course for beginners.
            YouTube Channel - Public HISE tutorials
            My Patreon - HISE tutorials

            d.healeyD 1 Reply Last reply Reply Quote 1
            • d.healeyD
              d.healey @d.healey
              last edited by

              You could also do something like this, but it won't be as bright:

              	if(obj.selected)
              	{
              		g.setColour(0x990C0C0C);
              		g.fillRoundedRectangle([a[0] + 4, a[1], a[2] - 4, a[3]], 2);
              
              		g.setColour(Colours.withAlpha(0xff5F5BFF, 0.2));
              		g.fillRoundedRectangle(a, 2.0);
              	}
              	else
              	{
              		g.setColour(0x990C0C0C); 
              		g.fillRoundedRectangle(a, 2.0);
              	}
              

              Free HISE Bootcamp Full Course for beginners.
              YouTube Channel - Public HISE tutorials
              My Patreon - HISE tutorials

              StraticahS 1 Reply Last reply Reply Quote 1
              • StraticahS
                Straticah @d.healey
                last edited by Straticah

                @d-healey thanks a lot, it works well now. two last things, how do i offset a left aligned text to the right in LAF and how would i approach rounding just two corners not all 4? Thanks for your time, much appreachiated :)

                HiseSnippet 1358.3ocsW80SabDDeOCWTuqMJMp8g73V+PjQ0w4LDRSBhVv.WjUAhkMMsRHTz56Vauky6Zs2d.VTdoJev5Go9MfN6sm8clXmlZ0b7.rye+syL6LCsjh.ZbrPhrbNY7HJx5qr6LlqFr2.BiiZtOx5araIowTUCo3xXpDeHoGpw3Qj3XZHxxZkWqEzxYUT52e+SMHQDd.MmDB8VAKfdHaHSkSs0N+LKJxmDROgMrfzOamlAB9dhHQB.pUr8PiHAmS5SOlnEqjMx5dGDxTBYGEQQiQVq1PDNty.wkbi7ukEy5FQ0Gpi5.FxP1WDEpQrlJZuArnvVSt7wHvJsxCEqXBEeq8QrP1T54gjuNkANWihwCqRyBuUlAd0KBOuBvaNPxp.jV0.oGZ2IPxFox4nwyWZ2jqnxdDHrWDJFYQkRV0dOAHAWUaH4bpuDNLUiJO2yqJ9Ya5s1VttPnOVg6ZR0PlFuM9.deFmVKPRg6yqiDcIQF6dnPb9t7PeJMphV2bspIo8Ywf88S3AJlfWobnjb4L0QGBBzTQGVtJt2Do5WEK596q4dsqqS+Zfr9.PqTtsnqPIvMUjHV.He80qoAqyEDIl.H7TPoZD.em5cVpELGpW7v5EOrwYmAp653fgOVObEMGE8JEd6swk2MLDLaCB+7xqkIi9KWFb4NzHZfBjJh0URjiKuUAAWjcmpDTbmLj+ua78f.dewhst9Vg+Q7Fdd3G+3bS7cfMVnwOVfaSiShTwk2xww008oOM.pAk3QoIGbbpyA5Nrdov2PfFBF7ZvlooEyqyJdW8xWto+lM780YCfUO3EcaQBGdm0FThv6GQqLIpWEmk1b9HlI6Ft.ScpNCi+dLTuZRuoQfmfq+hTJPZEbh1E23l9cm6FKLhNO2CAv8z+rrteVmCdMMXOGWO074d27q3ZWNfonYgQ8akciX84zvS.KMsJBbSUb4.3YrjFVV6J2aVaqIudvB9wBE8M7J5GPNt23huKqd8lKOcuAoHJhJmKac+Y4GSwJ7jgcoxp3KHQIzoBBMslsSn8h6DVrQcfoUUAAE7lbl5Min7E09Fk0eC9qeo49DEQ29LiFH2HpTwzPvZe5EvrHSyTG68owmqDiRkc3HAWaAq6qx59aZy4GIHJFu+IL.pLnu5CrKRpN5phi5FW7PF.Ld6AyNGE0s+jgbN26QO5Q2pU.pAFlS022+NTWWS91aSohRulkdeI6qcwPWCHb0gbAsQhRI3keEVISnUmv4fqFQ3wPVKd23r1OuB2iDEmKR57Q47UWW8D+A1DRtFwmgUNYndCtu.u5dSUBZtNeWzlxgA7ym29POH0B34StPHgHjdqgh7xPVS3VGRaHjvcalq7wICMABM32Hkj47uxBUCZC4WAv3TW8aVuZabmup+GoCjOK0G5wd6BcCmFax7P048qoZYPVawksHggPg2mpdcnDYvfFDYCcuL8M8TCiiDxr34c4jWCcWNShze.W2aPWpCZSK8+q+bmATV+A4q6g+icxqh2PWEiPlpXcis7Rdfv6MqG9Aq9.KcIBShHpY2DSu9YFCn7dl0ezq3.oe03hqm9+15YepP7g1sXpfAyGiklCFgVWeNvX1Rs229fd8fQZ4.bUa+e6yyFrHXDptO4QDkjAsIsgGccfLc.E7NmSizCErJo6TZN6oOqi.cn7vzCPytayXVWe1JiY8ILQCIARw6BLihzqM+EoT.LwS+OFbrOReFWGkNdBzy1qlGZHrA+6BBzW+m.STluNquD5rwRnyyVBc1bIz44KgN+vRnyK9n5n+mm1MQIFZdN.DZcP5vLKqC3DnxJsJD8ObhLDLN
                

                creating user interfaces: www.vst-design.com
                founder @prototype.audio https://www.prototype.audio/

                d.healeyD 1 Reply Last reply Reply Quote 0
                • d.healeyD
                  d.healey @Straticah
                  last edited by

                  @Straticah To change the text position you can left align it and adjust the x of the area.

                  If you want to round just two corners you need to do as I was suggesting before. You draw two rectangles, one with rounded corners and one with straight corners. If you are using non-opaque colours though if might not work so well and you might need to use an SVG.

                  5d9e574c-7cb8-4210-952d-5823f904866c-image.png

                  HiseSnippet 810.3ocsUstSaCCE1tzfnciogzd.h3WAoRUJvXSBMMVuMUMtTQYnIgPHiiaiEI1QIN.US7Trmh81s2fsiiSosipNnRK+n0ma1e9b9NG2MVRYIIxXDtzoCiXH7Ks5MTn7a3S3BTmlH7qrNjjnXw1FU0GFQRRXdHLdoOqUfKUDk88qOVmDPDT1XUHzYRNkc.OjqFqs69egGDzl3wNkGNg26reGpTzPFHSA7rjkKJhPulLfcDQ6VAKDd4VdbkLtmhnXIfO0kdC64KuUX7+LdB+p.lVnFpGrQF0nF97.utitqIHDtX2w27kL272XcH2i+f9wYfWmYvdbDSlCvElGjp8LfDdBHUz.o0r5Qi4QpwVz34EVcDPAoOAR0SBEiunB+Da0PBdHTUCIWyZGCBODgytttUrge1Xuxkgzchx9FRrcWhfETy9C1ihb.S0PFFIEffy5FyqqiwrrZBS0ERPpSjoJtf4zOUPUbovYvFk+d4R58j.amxmmn2qCjTRPcYpvKwI6nKMPuElhsi4ujpwLOvVIsw9.E4Ds+LuSXTEQLHf4PpXuk6Td.lbNmb9VWXuIXphM47ZWTIe01WbA368ar2HrYKEGIUriENYXr78ks+aS86OSa5rRrLHfEOSyZdb77BzQjFdEKtBjqCRYO3HTnml8r7Si8PMEoIbTJ5H3piiX4xskAdZVgd8i4Zn7pLr5qcZRTDM8KWG3WDKVw0vA2jcCz+ZHikrZxRtVIix7MmZ.PVkYc0QTUM8.wgidEKCUAcGBag+AbVC0Kjvha4dJesvcffOiOvWokDYSGdTW.z+I8RCHpoaJ0SexM.45o5DzrcQBWMbxoSOiNU241o9Tg3ZVc4Jp+rwXgYfQnJ7+.i4y2V0pU+9P+xX.Vzp82VzgY+ii2LVXvgDULWW+OJMrGzhSYvoK.VQhtdWPyDMxtZYcFnGS3kI7a3K2XMsLN2XsQFQgDZr7RpoCSOAckLM.lDYOXTBd4Bjsqgx55f3rbq5hBgg4WRo5q+lPywriYqEHlsWfX1YAh4sKPL6t.w7tEHl2O2Xzui9oTkLzzN.J51Ja7CF2RP.lUFKD8GfUNNUz
                  

                  Free HISE Bootcamp Full Course for beginners.
                  YouTube Channel - Public HISE tutorials
                  My Patreon - HISE tutorials

                  1 Reply Last reply Reply Quote 1
                  • d.healeyD
                    d.healey
                    last edited by

                    I just noticed that you can pass a JSON object for the corner data of a rounded rectangle, so it's probably not necessary to do the two rectangle trick any more. I'll see if I can find more details.

                    292aeafd-8ee8-4721-8c7b-e93b65c68d1d-image.png

                    Free HISE Bootcamp Full Course for beginners.
                    YouTube Channel - Public HISE tutorials
                    My Patreon - HISE tutorials

                    StraticahS 1 Reply Last reply Reply Quote 0
                    • StraticahS
                      Straticah @d.healey
                      last edited by

                      @d-healey oh thats cool

                      creating user interfaces: www.vst-design.com
                      founder @prototype.audio https://www.prototype.audio/

                      d.healeyD 1 Reply Last reply Reply Quote 0
                      • d.healeyD
                        d.healey @Straticah
                        last edited by

                        @Straticah Oh it is really cool, I just had a look in the source to find out how it works :) I need to make a video about this.

                        g.fillRoundedRectangle(a, {CornerSize: 20, Rounded:[1, 1, 0, 0]});

                        Free HISE Bootcamp Full Course for beginners.
                        YouTube Channel - Public HISE tutorials
                        My Patreon - HISE tutorials

                        StraticahS 1 Reply Last reply Reply Quote 1
                        • StraticahS
                          Straticah @d.healey
                          last edited by Straticah

                          @d-healey very nice! this would speed things up by a lot! Whats the best way to write the x offset of the text? Just placing it after "centered" did not work maybe i missed something.

                          creating user interfaces: www.vst-design.com
                          founder @prototype.audio https://www.prototype.audio/

                          d.healeyD 1 Reply Last reply Reply Quote 0
                          • d.healeyD
                            d.healey @Straticah
                            last edited by

                            @Straticah g.drawAlignedText("text", put your area here, "left");

                            Free HISE Bootcamp Full Course for beginners.
                            YouTube Channel - Public HISE tutorials
                            My Patreon - HISE tutorials

                            StraticahS 1 Reply Last reply Reply Quote 1
                            • StraticahS
                              Straticah @d.healey
                              last edited by

                              @d-healey perfect this already looks like something :) Tomorrow i will try to remove the columns and style the search bar aswell as the fav icons. Lets see how this goes :) Tx again for your time.

                              05e70d56-256f-4e02-9599-aad896f08d9d-image.png

                              creating user interfaces: www.vst-design.com
                              founder @prototype.audio https://www.prototype.audio/

                              1 Reply Last reply Reply Quote 1
                              • ?
                                A Former User
                                last edited by

                                this thread has officially inspired me to stop being lazy and make a LAF for my preset browser :)

                                1 Reply Last reply Reply Quote 3
                                • S
                                  Soundavid @d.healey
                                  last edited by

                                  @d-healey The expansion images are something that we can achieve within HISE or are something to do with custom CC+?

                                  d.healeyD 1 Reply Last reply Reply Quote 0
                                  • d.healeyD
                                    d.healey @Soundavid
                                    last edited by

                                    @Soundavid Within HISE using look and feel, nothing special

                                    Free HISE Bootcamp Full Course for beginners.
                                    YouTube Channel - Public HISE tutorials
                                    My Patreon - HISE tutorials

                                    StraticahS 1 Reply Last reply Reply Quote 1
                                    • StraticahS
                                      Straticah @d.healey
                                      last edited by

                                      @d-healey Good morning, i have seen that you made a video with a filmstrip button for hover which also used an image, is this made this way?

                                      creating user interfaces: www.vst-design.com
                                      founder @prototype.audio https://www.prototype.audio/

                                      d.healeyD 1 Reply Last reply Reply Quote 0
                                      • d.healeyD
                                        d.healey @Straticah
                                        last edited by

                                        @Straticah Everything I'm doing with the preset browser is just laf. There is no method to assign film strips to the preset browser.

                                        Free HISE Bootcamp Full Course for beginners.
                                        YouTube Channel - Public HISE tutorials
                                        My Patreon - HISE tutorials

                                        StraticahS 1 Reply Last reply Reply Quote 1
                                        • StraticahS
                                          Straticah @d.healey
                                          last edited by

                                          @d-healey ah got it. Will look into that in the future, seeing that it is bossible tho is very cool. Is there a way to x offset the favicon to the right in the tabs?

                                          creating user interfaces: www.vst-design.com
                                          founder @prototype.audio https://www.prototype.audio/

                                          d.healeyD 1 Reply Last reply Reply Quote 0
                                          • d.healeyD
                                            d.healey @Straticah
                                            last edited by

                                            @Straticah I think the icon position is fixed

                                            Free HISE Bootcamp Full Course for beginners.
                                            YouTube Channel - Public HISE tutorials
                                            My Patreon - HISE tutorials

                                            1 Reply Last reply Reply Quote 1
                                            • First post
                                              Last post

                                            23

                                            Online

                                            2.0k

                                            Users

                                            12.6k

                                            Topics

                                            109.7k

                                            Posts