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.
    • 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