HISE Logo Forum
    • Categories
    • Register
    • Login

    Round Corners for Floating Tiles? (FilterDisplay)

    Scheduled Pinned Locked Moved Unsolved General Questions
    20 Posts 5 Posters 497 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.
    • Darkmax204D
      Darkmax204 @d.healey
      last edited by Darkmax204

      @d-healey Sorry for the delayed response.

      You can apply a single look and feel object to multiple components

      May I ask how to do just that? I've been racking my brain over this, but considering your videos are my only guide to HISE, I'm a bit lost. I appreciate your help though, means a lot!

      Edit: Never mind, figured it out. Thank you so much for the help regardless, you're a godsend!

      For anyone with zero experience like me who might have the same issue, you just have to do it like this.

      
      const var FloatingTile1 = Content.getComponent("Object 1");
      const var FloatingTile2 = Content.getComponent("Object 2");
      const var FloatingTile3 = Content.getComponent("Object 3");
      
      //And so on so forth.
      
      const laf = Content.createLocalLookAndFeel();
      FloatingTile1.setLocalLookAndFeel(laf);
      FloatingTile2.setLocalLookAndFeel(laf);
      FloatingTile3.setLocalLookAndFeel(laf);
      
      laf.registerFunction("drawFilterBackground", function(g, obj)
      {
      	var a = obj.area;
      
      	g.setColour(obj.bgColour);
      	g.drawRoundedRectangle(a, 20, 2);
      });
      
      StraticahS 1 Reply Last reply Reply Quote 0
      • StraticahS
        Straticah @Darkmax204
        last edited by

        @Darkmax204 @d-healey i was wondering about this for a while, since i use panels for cropping sometimes.

        Is there a way to crop/cut the radius aswell since panels when used as a container usually crop stuff to a box anyway like a mask would do.

        83c9e634-bbb0-4aa1-8574-1f192536ecd5-image.png

        HiseSnippet 958.3ocuV0saaTDEdl3rAroE0JPb8pbUAEj7Z65jTopZh+ArfjZhCEtqLdmY8NJ6Ny1YmMoVkJwKARbAOFHtlG.tiWDdCBmY+I6tD2RkETekmuybly47cNeyryTRWVbrTgvsNaUDCguk07UBs+PeBWflNBgeeqiIwZlxNC5nUQj3XFEgwM9bC.t41nze+0iNhDPDtrRHD5IRtK6q3gbcI5rAeIOHXBgxNiGVY28FL0UJFJCjIP9zvpMJh3dNYI6DhYaaYg9BRrOB+IVsueeFa+tdTJoaWZ+98O7fC6cnCwqcOxBm9G1qSu86bv9dH7NiobsTMWSzrXDd6ijzUy8kWJxBvS3w7EALyBGzbHxYvSjATSIZPQC84AzYEDULBNkYkzViLZ6CsNlS4WiWRe2I0fcoGUIP7V0SuF0ROmpoW6Jo2ZRIbkTZ6rT5tVycU7HcoES97dVSEP2zi.8opoR1dQ3ewx1KQ3p4RgsTbhTydr3debqWzpYqW15Fl77VqsgRgVICBXp0Z1z1UuNGumHIbASsm8EjfD10aDJs57k0qlup1NgoJMSnqrQoXpfqebDS7pZxngYNA+6alNhnIFRNGC1WDSo4lT.OhcALhmQ4MsFwhOWKiR2aXjTXNA76nSsd6hFBQvBPbpoYXNQXTgoPOGJG7LHbqL+4Wg+bImp8MK9CLB4y3K80lU6BqVHUTl5TBkmDWU.UKr2RmOZlE1IARhlKVdFGXHSz2wZplElEXTQfQkkdVM8QViTjkKI.uNgG.iNYo+hkEB0l6b0u8S6Y7iCGWEzqt5Gqi1w.CHcMvobJ9TqWzx1d2qY9ozce.rjn.IuVwel83u1Y28LaYpfxdNX7ScRWBRz.4keqTcdLbKACL3QBhYsdYAskSJ+9OLnf5xQrUChHJn9pPUUaDnaJk.QrjlDPz0U1l6+xM.iu0jSFQlHlqWU89w+yj6uoo3cslw0t9qOG2ZM4HLj++QNleI4ssF64wb0kI31VS9t2B2H1pPdNLQcAa7yx6e0GypkGmjDlMsatkAaTEGQDz14Lk8O+P6AF.mbfu+O+fGkBzo96gBZ2+IPuRf6LXxjyFKLRqrhuwabw67549SkIFo9wDn3L5anblCBPWFP8BP9lVUaYj5YqaWH8myRqRKLnduJ2nSAEXL5TX7sRLBItJ4ScydUvzUe2TDntEoeSPS3iSf01NnzWJpNHGBO69TW25G0Mbryl5X2M0wdapi2eScr+l539apiG7u6n4qh9rDsLL6dID53YiydR.WQQf9a.oDC2HA
        

        building user interfaces in HISE :)
        web: www.vst-design.com

        U d.healeyD Darkmax204D 3 Replies Last reply Reply Quote 1
        • U
          udalilprofile @Straticah
          last edited by

          @Straticah Hi, Is it true that you made an interface for nexus 5?

          StraticahS 1 Reply Last reply Reply Quote 1
          • StraticahS
            Straticah @udalilprofile
            last edited by Straticah

            @udalilprofile yess! :) - not in HISE tho ^^

            building user interfaces in HISE :)
            web: www.vst-design.com

            U 1 Reply Last reply Reply Quote 0
            • U
              udalilprofile @Straticah
              last edited by

              @Straticah Oh, you're cool! I'm studying and writing a short report on the vst industry. Can I ask you a few questions? It would help me learn more information.

              StraticahS 1 Reply Last reply Reply Quote 0
              • StraticahS
                Straticah @udalilprofile
                last edited by Straticah

                @udalilprofile sure dm me here or write an email with your questions :) to keep the thread clean.

                building user interfaces in HISE :)
                web: www.vst-design.com

                U 1 Reply Last reply Reply Quote 0
                • U
                  udalilprofile @Straticah
                  last edited by

                  @Straticah

                  Tell me, how did you start collaborating with refx? How do you find an acquaintance or did you already have contacts with refx?

                  What tools do you use in your work? (Editors, scripts) Examples (refx)

                  Do you use GPT?

                  Plugins (development and design) - is it your job or a hobby? If it is a job, can you provide for yourself by creating a design for vst?

                  A direct question: how much will it cost to develop an interface (gui) for a project like Nexus 5 (You don't have to name the exact amount, but specify the currency and the number of zeros)

                  What can you wish for a beginner.

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

                    @Straticah said in Round Corners for Floating Tiles? (FilterDisplay):

                    Is there a way to crop/cut the radius aswell

                    Your snippets not showing a UI here.

                    Libre Wave - Freedom respecting instruments and effects
                    My Patreon - HISE tutorials
                    YouTube Channel - Public HISE tutorials

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

                      @d-healey oh i see Content.makeFrontInterface(600, 600); was missing.

                      HiseSnippet 966.3ocuV0saaTDEdl3LAroE0JPb8pbUJJf7F65j.BUS7OfEjTSrok6Ji2YV6QY2Ybmc1jZUpTeIPhmDttuC7hvaP3L6t16tstkHKn4Bqb9NmyLememcnV4wihTZDt13Ey4H7sHiVHMy5LiJjnAcQ3OlbJMxv0NoPmrXNMJhyPXbkuyBfqtMJ4u+9AmPCnROdNDB8Hkvi+ihPgIGcX6ePDDzmx3iEgErtY6AdJYGUfJF3SERczbp2Ezo7ynVy1hf9dZzLD9yI0ueKN+vF9LFsQCVqVsN9niadrK0udS5D2VG27flGdvQG5iv6ziILJ8HC0viP3sOQwVLZl5JY5E7HQjXR.2J3hFA2bJbeU.yFhVTTmYh.1vkIpHDbJCySaURSaeJ4TASrBOO8cmDEN4dTLAh2pL8pThdtEoW8BzaMTBWfRamRo6RF4oEyM4Zr74iHCjP0zmB0ohTI0VD9UjNJv.o4KCoWv6qAgUNrWq5022A94deserzyHTRGk7Lkg+P4d2q1yqUs1Kp475p78WqN60nUAAb8ZUaaMzuKG2SFGNgq224RZPLekgP3WNmRd64zhkbuzntfgJ4.ov7v4b4aqQ.kkpf+6mGzkZn1BQFFX2bt1HrT.2keILFjVVpR5xitvnlmXa3bkzdB3Ovjn81KKZTIO.IX1Bl8Dg1ItF8r7gkwsWrR3k9suRvLyVA7peq8LtX5r7gNGc6IJMiqOmxDwQEG5JQiaYxZmSoQ+.E0HjSGKfLlkM6PFX3gEIBBsnnPV3mFqeFoqlNcJEx28EAPWTZXMY5xg7p6b8e966a8S.GaAzqu9kkQOvBCHMrvI4Z74jmWywY2UUjArc+JPjpg0EFs3oN89I2c22Zx.Ii+LP4W3lHBi2ApqdrReQDrggCJ7oAQ7Zu.cCRiyoZH9JjxJVfPu4XHr.PwhCnlxaEr6NyT.s0kFEsyaxHgYQwcq+msp3lRw6RFJLdyVOG2ZMbDZ9++fiYKXuMomuO2yjSvsI8+k2CaSqsbrsSr9RdumlU+J2lUhGmEGl1sa29fwP3bBUxpmkob9iuwosEvMC3W+qO4AI.GT9sTIqwqCzLG3Ns62ebOoczJM3qbiCd22ct+bUrcj+TJDbvbNABmQv.nGGR8RX7MIp1xNpmJW2JaozHdRTRvvz60YJcWlBrJcWp78xcDR8zpm3k9Zgsp9gIHPbKS9dhpvG1.xNtnjWPJ1HGBOY+DOuxG0a33AapiM1TGatoNd+M0wVapiGtoNdz+ti1un5aiMpvz8RHzoC6k9j.tvDA5evZbn9y
                      

                      building user interfaces in HISE :)
                      web: www.vst-design.com

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

                        @Straticah So it's basically the same thing I showed before, but you will use a paint routine in addition to laf.

                        429e74df-caeb-4007-8858-913242e6875e-image.png

                        HiseSnippet 1166.3ocuV0sbaSDEdkST.KZYZGX3ZM9JGFiGKG2j.Y5TW6XCdHI0DGZ4txlUqjVhzttqVmTSIyzGCtg2EdG3Eg2fvYkjsjZRJY7.0WX6yeq9Nm87cNZrTPnwwBIxv5j4SoHi6YNYNWEzO.y3nQ6iL9TyCwwJpzNUUu4SwwwTWjgwZeqVgQ00QIe96mzCGh4DZtJD54BFgd.Khox0Nt62yBCGhcomvhJ3cmtiHBdeQnXFfm0LaglhImg8oGg0tUwD8c33.jwWZ55zwwaWBd6cc5zlPZu6Ns+5cHTrmGcamGsSmc853gIsZiL1XfKSIjSTXEMFYrdOg67IAhK3oOfmyhYmFR0BNnIvSNU8PQnqNE0ZQ8CXgtiWTnhQvoLNursVZY6yMOj4xVpOu78fDC14QTr.ZToL7VqD7bJBuVEf2M.IiBPZ8TH8PyIDIapJ2hFOeh4HNbaBkGZInj5KpxeTwru.7fqZFgOiNTBBKin91sZ0vF9Zy8rrf6pXk84Xo8vPAVw39mvBoN1O1dwA3SU8EQSEbPndsQJZTs7.CwdEbkHoPI3.AAGdfPb1S4tCozv5f6kN7lwT00bBNI8wB+zTR8Y5l0gy3DESvqWyUhuXHKDz0CZl7khYb2ZMr8V3feCawo+xlVuwppNUv.l.4lX.O6YcY47TCV3dE3B2VNtzijDcojF1ig+oNVLCxEZ87GeomrJfEqOwjTrmFpw0005pVU80mQJ2nd5OwMuHfonZy9M0o4w5.ntGSIJL2OjVG2X4IVu1oBoKUdL1kMKt1lW2xD1uRqs4l6UEx5EvyVvORnnOiWOAlVWZY+tl77tQa5TWJBCoxazrl3KeeAVmOK5TprAT2CmQW5HzbWlwXd6LlhDZR5sUAGE7Qbl5YSo7ailixthg+8ii1GqvZZVlNvuoTohogfw9zyggbojtpl6SiOSIll3aVeAx3iTIVu+BJIlSCQLWMcbYSB504iBOo67kBu0q6ELWUvRE+4u0Mfx7CxGoZK6V75s3H0Rv3dprgUovnH0JAMaXpIoEABBMunPV5mlqeg49RruOFp2oLrzz5T+Eivqtwh3f9znbsWc0Uusr11YNukVcRs13Xy2XYaWa4MxH2ZeCHhkvx.kj8J6A+fSsFZWFAc8uFL9UNIhvv6PwEuPHOKF1ePACd3vXp0kn6PYbJP74pBkrhWPnqOjEFuKbmEhUkm4q2LlY.ZqKMnUOLkGyTyKt47+rEA2UH9PywLEI3lwXka.iPy++GXLa848MG.6tIpb.tt4ve5CvtRqEz19yjmSG7pr6uxsYkvwQyhR610SeLLfzoGl61JqRY+6O1tqVgSlhe9u9rmjnnc42Th6t06pnSthGzc3vSFv0Tqzjes6bx679q8oaf7ODCIGvyMgzYBP.ITnzyA5aRVUQS0Skaok0PZBMIKMM.16UYFcVTBzFcVX7CxyHBSjhWRR2VnuU+3DMPdySdawpvqsBx1NnjMHEajifWH6kDR4i5ZA1dUCbqUMvNqZfOZUCb6UMvcV0.28eOP86K+zYJQT5bID5vwCRWIXTfQf9GXJdKdO
                        

                        Libre Wave - Freedom respecting instruments and effects
                        My Patreon - HISE tutorials
                        YouTube Channel - Public HISE tutorials

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

                          @d-healey maybe its not clear what i meant, i am sorry for making the effort but on my end it does not crop /mask the objects edges.

                          e14e7542-ed68-42f7-802d-8347243fb989-image.png

                          Other tools have something like this:
                          f5d0c41a-474b-4e97-9673-63fc83a10638-image.png

                          building user interfaces in HISE :)
                          web: www.vst-design.com

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

                            @Straticah said in Round Corners for Floating Tiles? (FilterDisplay):

                            maybe its not clear what i meant, i am sorry for making the effort but on my end it does not crop /mask the objects edges.

                            Fill a rounded rectangle in the paint routine.

                            6b771a00-52fd-4841-88d1-41b36b9ebb9f-image.png

                            Libre Wave - Freedom respecting instruments and effects
                            My Patreon - HISE tutorials
                            YouTube Channel - Public HISE tutorials

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

                              @d-healey yeah the padding saves it there are a lot of applications where an actual cornered crop might be better.

                              81773754-7124-4fd0-9939-983ab0980d20-image.png

                              like for images, shader panels, audio analyzers and everything that may exceed (or completely fill) its bounds - audio spectrum in your example might overlap the edge on high dB right?

                              It looks cropped but is not - for everything that is transparent or has lots of padding its not needed :)

                              The panel crops, but its not respecting rounded edges - maybe its intentional

                              CSS uses Overflow: hidden

                              building user interfaces in HISE :)
                              web: www.vst-design.com

                              T d.healeyD 2 Replies Last reply Reply Quote 0
                              • T
                                tomekslesicki @Straticah
                                last edited by

                                @Straticah @d-healey it would be great to have an option to take the alpha mask from another component. This is just one use case, but I can think of a gazillion others.

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

                                  @Straticah said in Round Corners for Floating Tiles? (FilterDisplay):

                                  might overlap the edge on high dB right?

                                  Not if you make it smaller than the panel. The problem is as you say it's padding it rather than applying any kind of cropping or mask.

                                  Libre Wave - Freedom respecting instruments and effects
                                  My Patreon - HISE tutorials
                                  YouTube Channel - Public HISE tutorials

                                  1 Reply Last reply Reply Quote 1
                                  • Darkmax204D
                                    Darkmax204 @Straticah
                                    last edited by Darkmax204

                                    @Straticah said in Round Corners for Floating Tiles? (FilterDisplay):

                                    @Darkmax204 @d-healey i was wondering about this for a while, since i use panels for cropping sometimes.

                                    Is there a way to crop/cut the radius aswell since panels when used as a container usually crop stuff to a box anyway like a mask would do.

                                    @Straticah I actually encountered this problem, but in my case, I'm only using a filter with this type of coloring, so it only happened on the lower parts of the border. It's inconvenient, but it might look good if I go back to Photoshop and make only the lower edges square again. Would make a cool design choice, I think.
                                    issue.png

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

                                    15

                                    Online

                                    1.7k

                                    Users

                                    11.8k

                                    Topics

                                    103.0k

                                    Posts