HISE Logo Forum
    • Categories
    • Register
    • Login

    Flex Envelope - No UI control for Hold

    Scheduled Pinned Locked Moved General Questions
    21 Posts 8 Posters 660 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.
    • DanHD
      DanH @Christoph Hart
      last edited by

      @Christoph-Hart last thing 😆 Perhaps the mouse handles should be an updown arrow for the curve nodes, rather than the hand, since the curve nodes can only move up and down...

      DHPlugins / DC Breaks | Artist / Producer / DJ / Developer
      https://dhplugins.com/ | https://dcbreaks.com/
      London, UK

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

        @DanH @Christoph-Hart the flex envelope is essentially missing the spline XY handles to create an envelope in the first place.

        From a UX design standpoint:
        01 Base level (priority): conventional ADSR controls — Unconstrained handles for Attack, Decay, Sustain, Release, no dials required, easy to read/adjust.

        02 Secondary / advanced: spline-shaped ADSR curves with Bezier handles for fine-tuning shape.

        Current Issue:
        The existing flex envelope design inverts this hierarchy, prioritizing Bezier-based curve editing as the default interaction. (Which can feel slow and constrained for user since base level controls are missing.)

        ef38f7e1-9868-4dd1-b133-c13582cf2acc-image.png

        Initial envelope discussion:
        https://forum.hise.audio/topic/11509/custom-envelope/19?_=1754988313518

        3facda0e-0512-4601-800d-6f4890916a50-image.png

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

        Christoph HartC 1 Reply Last reply Reply Quote 1
        • Christoph HartC
          Christoph Hart @Straticah
          last edited by

          @Straticah Yes I think the main issue is that weird distinction between horizontal and vertical adjustment (which is hinted by the mouse cursor change). If I change that to allow changing both dimensions at once, then you just need to slap a rectangle at the corner points and voila you have your UX, right?

          StraticahS 1 Reply Last reply Reply Quote 2
          • StraticahS
            Straticah @Christoph Hart
            last edited by

            @Christoph-Hart exactly

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

            1 Reply Last reply Reply Quote 0
            • Oli UllmannO
              Oli Ullmann @Christoph Hart
              last edited by

              @Christoph-Hart
              FYI
              obj.active does not work. It is always 0.

              HISEnbergH 1 Reply Last reply Reply Quote 0
              • HISEnbergH
                HISEnberg @Oli Ullmann
                last edited by

                Just to add to this, laf.registerFunction("drawFlexAhdsText", function(g, obj) doesn't seem to work either....

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

                  @HISEnberg said in Flex Envelope - No UI control for Hold:

                  drawFlexAhdsText

                  You're missing an r

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

                  Christoph HartC 1 Reply Last reply Reply Quote 3
                  • Christoph HartC
                    Christoph Hart @d.healey
                    last edited by Christoph Hart

                    Alright, I've pushed a change that allows to switch the UX to the proposed method. There's now a UseOneDimensionDrag property in the floating tile - the default is still true so it keeps the old behaviour unless you change that.

                    Once this is set to false you can drag in both directions to change the length and level simultaneously.

                    obj.active does not work. It is always 0.

                    Nope, works here, but it is true whenever the segment is currently played by the last active voice, not if you hover over it or anything else.

                    That's the snippet from the snippet browser with a colour change for the active segment:

                    HiseSnippet 2633.3oc2ZsDiajTFtclzgXuIQIKvlMvkRVfvCZvqsmIOgUSOOrSFXd3LdxiUQQ6VS2kcWLsqpoeLO1nHEIj35dlaHtwMtv8vANvMNwsUJbiKH16HwveUU2tqdFOy3wjPxh0Fkz+0+eUe++0+qppsc.2lDFxCLJTZi87IFEtfYm8XQtK3hoLikVznv6Y1xir6FjvnFFyumONLj3XTnvD2UvPghm0P96qlcdrGlYSxHYX7PN0lrLsOMJiZaqeF0yqE1grAsuF2yXsjMms.2iGCfYByZF9X6sv8HqhErcFSi6gCcMJ7CMuwsu8M6dSR8ZNXmYpSZLciaQt4L2pqS8aLyz2t1zWeSbsMm1FaT3bMcnQ7fNQ3HRnQgyNO2YuNt7cXpE3gzP5ldDwG0M5.qrhbKtmiPEETMVvk54zN0JEZXTvrclMaBkM6aYtB0gNfdls6xxAPYRna.Kbl7vahbvqtN7poAug.oBZP5rJHcEyN1AT+nrQT6kKwhHAcwv9jNTT7Zbl+cQyE3.Grnp8waQZE.eLPhJ2nVsoPyTq1j+3RkXvtRHrCQPBui4t2hcV+dXliGInzyJUpDrUFFg1FGf7vcQeLJcVsCHfxtL2F6sLmu0bLmVDhWEwL9QeDZCWRHAgCf+34gVdtVntwL6HJmgvaiodXvbf5xCPQtveCqKhv1l3w8IkfkoZ.oGMD.aqDgpT1I.uiDetNgAyC9S8B3wLmxSMXhqzaJDeye9j.pK1qZWv0bNOuJ01sUqFxe.xdt.civ72J1yqMNx8Hm8PRjx+th5uBqtiKMh.SOLnXpDRWA3upO7OjRJ+WyAFsoP0qV6T.lEhC1lzlSYQi.bDpasqeqF2dFEVDlglddT+PRkmHPg8fY6I0dJ5GccE1znVGnh.x0qI9ySOE.sCoWexHgRwRhAN1lflEkZACHNn6L3qM8hIYpvALmqSrivrddD0LAF0IEhGaSbpTu1jmBL2lGREjGuc5CYc8Elv0XB3JMuSmr0qQVZeA52.9uAV2zfpdhUquOmAeTo7f3w6Ff8cKOo.LGJfCTxjXtU46f1gfXDvPFwQPfKCrSxHLPm60SFy4PC88v6IXH12AhfkiuEiuYHBBNEyifPnLMBk0C8fkphVhg3ANj.gTNbTHGVme.DWGKhwQaFvwN1XgUFjEGIlC.G3nHrsqPDQJfLD3iCfLN.ygHHMyAQAjoA14CQ63RXBh6IlMQdDaWXGm3TUOizBqsR60Vs4pazARLAaWyIVxstCpHBMbKphgxSNUoh2CpM.bdjrJFWx3hDa7dGGmRFjr1INLBJXbL.HgCI2qS7H3PxwvcBGYvPlK3NniEIRdjhnz1TYNNKRlLIKYhPGKrN3BsLAxfeBKjjmxSV544bY2LFpCJcA7ffUDuqtSB3.IJugfPHtjGM+MMeg1ys9bqzbilqK7EdxSg4GJuTwGDSyMYxREy3qpebnaE+jnmHWJrFgGyJHbgmWyW+iQMY8nLRRoPsgp.9hTv6prnx1h4EqLXuvA8BuC5InxTQArxCTVwGR++xOUkWP36qBinQnD0uO2INeXDXuNbYzCf1pp4YC9JRwamJMjkY4lOFV3L6B.BgvHWUW.kE45jHIezpc5daZHKj9X.nRBWqhdDIc2SJzOsyZqJSx.oEEIm1gF4dfYKfzkDPf9Og7CgpskDlE8KfQjciBvPVNbDJD5uEuawCqqNNKKx5y.8KayGzqD3+fkTY7zy5SclB4OkRWj49Eq7S7epHo6CEDqnFRkwtXomC8FUZPSMb1p7HxZrJRQgAQGbntcG5Xhfk.tGXmG5vhNqCNNAqvh6uIIPG3BFgtGy2Rp4Q2RpdGy1pXWMF4rkXzn07IripOZij.dn80hInBXMR175kRZdsiGEpeXPgdTOuoJUfgDwIGa3kc9s+RKiQP5yYJRLmS1W829B9HI62vTlfLmvV+jM+cijvEMSR6kSbiK1+OMRheQSsDf4lheyef+2mczPPR0i7Jv+369Wm8zf.YZ6bSwm83+0nMEWvLqBS9sflW8KGoY3Rl5EOxaJk+dvRKhivhSBk3UAdZ9jfHpvItvhjsgygpNWTQ.LgaEw8gC7NnNCfwnjCxoV6VdbrnOlMnfyt.AW1LeaUF6NX8egk0dYfop0l8RODawyAD1WPE58qeF082e+uSdpMRH+BA4HHWUtoP9aGpSj6f0w5EVtDZO2rCV+hsrRzckhdHDKsPE9UlOqDBUdPj3RNkgJNpr4hAVh4P1EHUS9EbTXO9NOhGrk7rd.8tXuPhbrrSXrAGRDIN6OLdiZUUh9fPHwFYQHSDKDx8HpmkJdomKh9GX6KcxA86peOAYV6OquUeb1XK+kV8oNP0mz9yyLWegkelFKxGHzXiAEdVRewfRkDAKx6mvgzEG6oxkmAhumktBT7jx6nAeGM3a85D9IKUNvOZV4zDbYH4kAiCJM9jSFkoq0IaiALLZvOKEqVL4ydSYlyVsWipP9z7ZpwC0SsDbxnK+DoP3GXtJOnO1i94Dm1j.a.K3dDiv3tco6JpN+8MNpMzWM6vc++pYG0slzZOY5DZmSoNkMIuwzmWM6oaeRUF5HRJ8h3QeeRMQu00qbUnOhz.ihZkaddqqUGnqgiH6vnnWGXldSpYG9lburo7vW3n7Wrr352SFPL252lq3FaghtQ6oGw9Z61lGUHdEy1zHa2giwyLDLBsu8l.iI2Q+EMa1sKbdvL.dVyVO9MyExqu7WUs7um4ivaSjOshbw+1xugyl1GcWwINE1t5Gy6q7WF02Wwejeek0ri.HrAz4VnOOjTWel6P5S2.hvByQ8.RzXnRji5hjnX1fo1Z5o+luTQJGWBSQKvTnsXm2JkXCchswLMl9jWBe2PuAjUn6pGN0jIt7vNDPycVKzFLLB6rdXQ6XngzGI5stttfYjanS9d3.GXOzNmS6DG2qLUeLekoy8N2qL80fTS4dHrhoXrCsuuGoYxUbIw36CEpjIfSolOzaENi66xYzbazqShBn85Qx4+LTEJ4fD4jU0zXJo6+6sVlxH3fUj0RFKaQ8S8iBNz8qOLoWDjHeA5qukTl3+qKoLLW622rM2aOkiZKpGzrhDDEMUebbkSLLZEP9EwDlcp0x5eZccq6md6R+5O+BV4cM+Pq6GCM6Lv5ht109y+w4o9bObv+sdGmfm7YGQ2iOvbfR8tterX23caLdMyjMWjvnhd6mO+JoMRM3dsj3Loe8wL8chNdjpRtL4xqaVdKKZWgr59LztV3zSqpcQqGH6u31eOXde8ysqcCu5GST6ZW0Nlk1Uol6PJiWNv5uV7ctj48e214VzwztuaCwqZBMr1.IK3gd6Twacdr3RvWACANPa0lqF2uCb5AaBfRFi3IdfnBmQ7TNpuqI9VcV.li7i8geICVW7cgjAqmN3+SVi9X6.9mZqdmAQZkyKo.5MS9+aYEMWQ7Mp9geYA3D7zO01N+TcHAaLtBN83J3LiqfWebE7Fiqf2bbE7Vmrfhy8LWbDuuJ1vvXk1MUuyQA0Q+jgIF+G7K2E1.
                    
                    Oli UllmannO HISEnbergH 2 Replies Last reply Reply Quote 6
                    • Oli UllmannO
                      Oli Ullmann @Christoph Hart
                      last edited by

                      @Christoph-Hart
                      Got it, thanks! :-)

                      1 Reply Last reply Reply Quote 0
                      • HISEnbergH
                        HISEnberg @Christoph Hart
                        last edited by HISEnberg

                        @Christoph-Hart Nice this feels much better, thank you for prioritizing it!

                        My only immediate comment would be to add a small amount of padding on the borders. It's quite difficult to drag one of the points (for example the release) when it is close to the edges. Not really a big deal, probably there is a way to get around in HISE script as well.

                        HISEnbergH 1 Reply Last reply Reply Quote 1
                        • HISEnbergH
                          HISEnberg @HISEnberg
                          last edited by

                          Here is a LAF I was working on for anyone who is interested. It would be nice to be able change the square handles for controlling the lengths, but otherwise this new FLEX Envelope is quite sexy. 💪 😰 🏋

                          flexsex.gif

                          HiseSnippet 3363.3oc2arriabbbnjFEy0OfsShkSN0fHFgxZEEI2m1BFh6KJsN6CJwUR1XAgbuyzjryNbZlYFpcWKH.cJWctjDja4CHGxmfAxgjiw.9ZB7kb1F4GPoptmG8vkuVFoH4PIsKmpqp5pptd0cOplmvh46K7LxLydmzkYj40LqehaP60ZS4tFattQlrlUcXGuEsowpmzk56yrMxj472DGNS1KXH+7c2XUpC00hk.xv3dBtEaKdGdPBzZU9EbGmpTa1d7NZXOekMsDtqIbD8.Q47lEM5RsNj1hsCEQ6blF2h521Hy6aVjcvA1MOXtOfUtToxevBEWXoCJCfliYQK2bo4KUboEVp7G.B4E2vlGH7pGPCX9FYtvpB6Sp2VbjqZBtG2mefCCenjQcXlUfqJbrQUDgZrVaticsHajugQFyZIVryqrX+Hys417X3IVt2TN.IgBcCXlykV7NeJwqjt3UTS7FfHkQSjtfRjdKy5Vd7tAIifxyqZtoa.yqIEVmzEEEtFm6OcIy0D.FtAE5POjU0CdHlh7KVr3rj4KV7xWelYf0J+.xCodjlAO.cOHeDIhzVrf0Dc5JbgGxmKb7b.UID4Pa9flooxxiA1gsDVTmsDhCWw0tJi4jGmLWvEvGbGXDjSqbq0qemaQcscXdy7nryj8ZWirJ3qzxSzy0lbDOnMokG2dlrQyRAOVKtOnFU64ZEvEt4yY6QORxr119dITmaVRyHbZMKQbvu7xyj8Qyjk.eZUvmEbSOpMGD2pfSb98Kdb0pkn3elkTT82zP.FTfBJ19y0.3L0wm0.TnP10D3wcXVA4ivBG5w3Oj5TMJnHGcMxbj5AdhCY9DPmAMSI.Dj5IWEq1ywAY3nUvC.l3tE8DlW9.udrHQUS+UAn4Kd7bvmUVoZ0D0AmObJjpSW3KJ0G+1JfxMKY4BEGEGWXgyLGmezbrZ0yLGKOJNp9kegiZyCXmAlV5zLk4ZqrywCf+.W1uY5EXDrLLCxXBYJ7BfPFctueoFjqjFxbMHuOoXgEuNYDNtKTTYaRKq6Wrwr8y9YCYy.9T73hEaJ+L.1DKwC1yeDVrzwAq0y6gLRWAGrIskg89jI2wWRcMj3Q45iVX4LTm+4LvBu70Sf2l5zLDbBJWiTtuUzgD6j1ib9462iDMEa33v65yxuOZDrhEXvJRtZxzeUxbJyjFFkNMFCbwJQvuBYwYS+n15xo8JGUluEWb0UibfFlTOZId1Q3YA4QWYoUVasAw+qLR9qOJtTzXJr1iQtSrfZeswYOWzyOYAx5jVbPWYtqKyKzWdtq2G7aALDfmfShOdZUY4kqJ+bFLqwSvf0Esgimdsu1HcBgMcs4Oja2i5P7Ys5f4J8.OWlG2skp7OEhxgbF9XmU.ar4VTLrexyZTWw2wkxviY2yhYi4r.K29wU6ktnKqU9uT+.JipcoES0gfDRiTKZ7lDU2ARE5xJfOJIpYzYWFZxVM4VG2gw2kVZP7c.k8z3apRoOV8KFTEXLpPoEldU3wo5dR3yw0snkegGjLnM2mzEqgB+dkMmb2gHlMN+gNTuCiCvJM+fKhngTRDlr.TOv9bZjtBYaPiK3ycyugKTiggMXe2tAv1mxeYnR+x3ONEeBilS3Y+Ur.azt8.UlzxQbDzPNj1eJKkgrZUmdLImFZJAYpoccwkQUNgDw7pj4Ca.PCmRC.mAWaKVEkgXodb701.YeaX6ZI8UyTB8DW46T5U5z1mRkN6095aFtxnmgyR0uoV107O0+diSYak9EhdANfe6TVV7YtPhMjuvojz6iM0SrDdLRadq1Nv+BRhoP3CnvIBNLRKFigU1rZ0wV17TpZD+GhplLbzrm7s9JZtE8.1YX+h6wNd7MLSsswRteDobQMaR.P5fqH1W0uhEwHbES5uVYL3R3gNLWwFWmLgejBR7pJpGZKFUE3QRrhGm5.ZWoxW95StS4JfKgKyF4nrNDpmyFqsyRx4gtL4zL6gG8Ax6SctFQKDwKP6.YgOhQbYLaRf.VFgterBfZVLBL6sZQOvA9F2uKjpFQnWWar6Fb7CcEG3SfZcRFgP7kGnCt3b2MK.MLQDdP+QHY1Bhu.lnetiComOiPIG3In1VTzY.nkFHYBHIzf.pUajFJfahL.EPocX.1pCjnO4.bAfPdexQsYtHvSjrCVXIVvl2ZwrKf5axIAs1taWa2c1Xm8pC9KfyU1Uvo8vOj.V9AefRJDxcYHAZ1aIbrATGJt33JLWmYQOYTnJQPga8dPmib2QHCgXnP+NLGF0mMBzCwPSRjaK8CIiTXj3nnQoyQDMJ6hFQgyZHUiTxN0TsE6gLmwLURbxA4Ddbe9vGzi6XK8HbfbLDQSceFveBO3QnuL3aHNZ9e5NF0V4Nqr8F6swcPGi8anBnDd46BTp40.Se1DTKzsme67ciCpjc7A+cDyC5XupVHvGQB6xRcfjZCkGcO4f+VNLvc8zzkCscTuV9eHYeRNNdRh4h0Z7AYbQtF54jCiv3AjPSQGgcuzQXfsCGPdVoLWvdK5B0Q6SlKnXzdhskzWKh774pt0FeBL4IFHPPPhCOHEOY1pPgIcrrUzpcT.MjdIVtBikKPtOKZwTRzGWe2cTIgfDjX1K4twRyNOVSFrcMK77L8UKPgHCqtP5HHepGERCRCH9m3FPON6.zWa6svpWv9Cym3J.5VnBb2MU4D0qfwsgdCmUoMp5XYwIe+tMv7y2CAmWMXbB7GOC7IhAfAXGQ.aW27WdlGIGjz+PMaNvwvXHOgiC164.FFuGDuQQXd2dcNf4EK6gHZj4Bou.AygeAB52ugkJjVCQg6lt7fc6xbG1sdXDlGvvHS1PoBPMPdUCuQ3UMT2gC0XL31FYdESUFBCoDGdIO+w+4WHpXLATeQSLscJZqb0+5uahn8GXJSclhXxW+o+9Ih3rlgoCSS92szuchH+0M0xKlhEO4i+Me6MlLIHrxRJx+rr+6u9FmEIPlNOMKB9p+0DwhWyLo1SZNboFSlP7Fl5EURwCi26u8Wtgwc2bcZ.Eu2pPuJvSqKyKfiNwYVm8PtEScKVYAgw+v.QWiLyDW9AjwfvqcSM2UcDTrWm83fytxJF14kwwwWv3SpT4jjaarPkCZEcWiYuH.3oHTXC.cRf9zm9zeZZnkCA+DDL13WJVH+bD2Nnc77T4IUZyvtBSDiCqDpzJM7MMiuRKXalcaaHMMY90lOZFBIWbH3l14fxNpr43.a5ZyNF.UT9TUH4h3n6K7NTdKY.b4AtKGK47u2S.YfvqnEFubwBJRuqOjQisNjBx0GR5fE0hHelGig8wF8YFez9w5Wmah09y5ToCMYrs9GU5vsgpOQmpRh45KpzMQiwDAnFaDW1YS8ICpUxPTjWirMqIsmiJKdhP7ypnq.YGWBGMw2VS7q7rT7CmpTB+jYkixrkHIeo2zHkFe53kxn4Z71XPFlLwOI2pVL4iddYlSlsmgpP576Zpw8zSs3MdoKMiTR36XtivqC0A14tcMlmEHKzVLC+dMaxOFKK+dFCaA8atwfc++taLoKMQEcRzIxQmQcJgIO2zmu4Fms0IU8mgjT5I8l70IEidgqWoJMOjz.ShZkhOuv0p9ZWXHYGlD8pON87TyN8KbyaZJ27EdQC5u+O3aIU3.Hu0eoavWrFnnavI5QrOydoflTQ7sLqwCrZOXY7bCPFg91ddHiguJUut4FMaBaFLQ.ufY0O44y6Mk9zeI0z+pl2m9Pl78eSN4+X4yvFS6PtItaSz1UZDuFb+8I80fq6D+ZvsqU.HB6Act42U3yJoy45rN78fHL+TP6ihxCjhTPWmEzyMl0Ulate3Wp.kBKzTTELEZS1qTIBXYcf0ntZH8oeI7bY8FP1lerd3zFt3AKVmAZt8t9VfgAsy5gE0vK049Xu0kzILAbYcv2h5YCqgVobZO+ndY.KMkuLfW7ktWFvuGjZJ06qX1HYrNuSWG1FgmwkTFeanPkLAbDzzgdaKbEcaKb4oVnuCKvi2pEKk+y.UnvMRjhVUSiQft8etxVbWF0aaYsjoxVT5L+taNv0q2MrWDBluf782RJm++qKoLHW621rlv4DkiZUtCzrRzaUs7gQUNwvnpG6W0i4ZEYsp7sUVnxsiNQs+vm+ZUR6Z9tUtcOnYmzV2U4cENTu+a8NFim7ElP2i2wLVodY2OFWMd4VF+IlgKtDznRdwmO+shZjJ9bsjxYX+5SY56PcbnpRpL4xyYVdJKZmcr57LzNO3ncqpcBqoy9KO129y6quucsi1UeahZm2p11rzNC0TaRQ6bQelEINo9Nug4se414F6X53WtEwKYBMrVlHK3QdwTw6Nhd3oeuMEBbf1pM2oWm5vtGrXfT55xbvaFJy4v6vQ8bQ7Y0dAbskO7T3S3fkvmyDNXonA+exbzgZ4Idfk5BFvzJuhDBn2tx+K.k0ba7YRozWo.9A1AO+AVVoY0oHr7zR3bSKgyOsDtvzR3hSKgKMsDt73ID22yJ8BDcTwFFFaWaC08bjQs0OYXhw+APh6k1o
                          
                          const var ft_Flex = Content.getComponent("ft_Flex");
                          const var laf_flex = Content.createLocalLookAndFeel();
                          	
                          	// Background 
                          	laf_flex.registerFunction("drawFlexAhdsrBackground", function(g, obj)
                          	{
                          	    g.setGradientFill([0xFF1a1a1a, 0, 0, 0xFF1a1a1a, 0, obj.area[3], false]);
                          	    g.fillRect(obj.area);
                          	});
                          	
                          	// Path w/ 3 Strokes and gradient fill
                          	laf_flex.registerFunction("drawFlexAhdsrFullPath", function(g, obj)
                          	{
                          	    g.beginLayer(true);
                          	    
                          	    g.setColour(0x3333AAFF);
                          	    g.drawPath(obj.path, obj.pathArea, 8.0);
                          	    
                          	    g.setColour(0x5533AAFF);
                          	    g.drawPath(obj.path, obj.pathArea, 4.0);
                          	    
                          	    g.setColour(0xFF33AAFF);
                          	    g.drawPath(obj.path, obj.pathArea, 2.0);
                          	    
                          	    g.setColour(Colours.white);
                          	    g.drawPath(obj.path, obj.pathArea, 1.0);
                          	    
                          	    g.endLayer();
                          	    
                              	// Gradient fill
                          	    var fadeStart = obj.pathArea[1] + obj.pathArea[3] * 0.6; 
                          	    g.setGradientFill([0x5033AAFF, obj.pathArea[0], obj.pathArea[1], 
                          	                       0x00ffffff, obj.pathArea[0], fadeStart, false]);
                          	    g.fillPath(obj.path, obj.pathArea);
                          	});
                          	
                          	// Curve point handles 
                          	laf_flex.registerFunction("drawFlexAhdsrCurvePoint", function(g, obj)
                          	{
                          	    var pointSize = 8;
                          	    var halfSize = pointSize / 2;
                          	    
                          	    g.beginLayer(true);
                          	    g.setColour(0x4433AAFF);
                          	    g.fillEllipse([obj.curvePoint[0] - halfSize - 3, obj.curvePoint[1] - halfSize - 3, 
                          	                   pointSize + 6, pointSize + 6]);
                          	    g.endLayer();
                          	    
                          	    g.setGradientFill([0xFF66BBFF, obj.curvePoint[0] - halfSize, obj.curvePoint[1] - halfSize,
                          	                       0xFF1A7ACC, obj.curvePoint[0] + halfSize, obj.curvePoint[1] + halfSize, true]);
                          	    g.fillEllipse([obj.curvePoint[0] - halfSize, obj.curvePoint[1] - halfSize, pointSize, pointSize]);
                          	    
                          	    g.setColour(0xFF33AAFF);
                          	    g.drawEllipse([obj.curvePoint[0] - halfSize, obj.curvePoint[1] - halfSize, pointSize, pointSize], 1);
                          	    
                          	    var innerSize = 3;
                          	    var innerHalf = innerSize / 2;
                          	    g.setColour(0x88FFFFFF);
                          	    g.fillEllipse([obj.curvePoint[0] - innerHalf, obj.curvePoint[1] - innerHalf, innerSize, innerSize]);
                          	});
                          	
                          	// Individual segment rendering with active state indication
                          	laf_flex.registerFunction("drawFlexAhdsrSegment", function(g, obj)
                          	{
                          	    var reducedArea = [obj.area[0] + 8, obj.area[1] + 8, obj.area[2] - 16, obj.area[3] - 16];
                          	    
                          	    if (obj.active)
                          	    {
                          	        g.setColour(0x4433AAFF);
                          	        g.fillPath(obj.path, reducedArea);
                          	        
                          	        g.setColour(0x7733AAFF);
                          	        g.drawPath(obj.path, reducedArea, 2.0);
                          	    }
                          	    else
                          	    {
                          	        g.setColour(0x1533AAFF);
                          	        g.fillPath(obj.path, reducedArea);
                          	    }
                          	});
                          	
                          	// Position indicator, this part is AI
                          	laf_flex.registerFunction("drawFlexAhdsrPosition", function(g, obj)
                          	{
                          	    var markerSize = 14;
                          	    var halfSize = markerSize / 2;
                          	    var pulseSize = markerSize + Math.sin(Engine.getUptime() * 8) * 2;
                          	    var pulseHalf = pulseSize / 2;
                          	    
                          	    // Outer glow layer
                          	    g.beginLayer(true);
                          	    g.setColour(0x4433AAFF); // Blue glow
                          	    g.fillEllipse([obj.pointOnPath[0] - pulseHalf - 4, obj.pointOnPath[1] - pulseHalf - 4, 
                          	                   pulseSize + 8, pulseSize + 8]);
                          	    g.endLayer();
                          	    
                          	    // Main gradient ellipse
                          	    g.setGradientFill([0xFF66BBFF, obj.pointOnPath[0] - halfSize, obj.pointOnPath[1] - halfSize,
                          	                       0xFF1A7ACC, obj.pointOnPath[0] + halfSize, obj.pointOnPath[1] + halfSize, true]);
                          	    g.fillEllipse([obj.pointOnPath[0] - halfSize, obj.pointOnPath[1] - halfSize, markerSize, markerSize]);
                          	    
                          	    // Blue outline
                          	    g.setColour(0xFF33AAFF);
                          	    g.drawEllipse([obj.pointOnPath[0] - halfSize, obj.pointOnPath[1] - halfSize, markerSize, markerSize], 1.5);
                          	    
                          	    // White core highlight
                          	    var coreSize = 3;
                          	    var coreHalf = coreSize / 2;
                          	    g.setColour(0xFFFFFFFF);
                          	    g.fillEllipse([obj.pointOnPath[0] - coreHalf, obj.pointOnPath[1] - coreHalf, coreSize, coreSize]);
                          	});
                          	
                          	// Label
                          	laf_flex.registerFunction("drawFlexAhdsrText", function(g, obj)
                          	{
                          	    var padding = 20;
                          	    var textArea = [obj.area[0] + obj.area[2] - 100 - padding, obj.area[1] + padding, 100, 30];                                        
                          	   
                          	    // Text
                          	    g.setFont("Arial", 12);
                          	    g.setColour(0xFF33AAFF);
                          	    g.drawAlignedText(obj.text, textArea, "right");
                          	});
                          	
                          	ft_Flex.setLocalLookAndFeel(laf_flex);
                          
                          1 Reply Last reply Reply Quote 3
                          • d.healeyD
                            d.healey
                            last edited by d.healey

                            The thing about the flex envelope in Kontakt that makes it a flex envelope, is that you can add a flexible number of points to it and adjust them. You can't do this with the HISE "flex envelope" which is really just an AHDSR with a nice UX.

                            Peek 2025-08-22 20-54.gif

                            I'd really like it if the flex envelope at least allowed us to define custom shapes for the sustain section. Or if the table envelope could loop its sustain part which would achieve the same thing.

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

                            LindonL 1 Reply Last reply Reply Quote 2
                            • LindonL
                              Lindon @d.healey
                              last edited by

                              @d-healey also called a.multisegment or mseg envelope...

                              HISE Development for hire.
                              www.channelrobot.com

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

                              21

                              Online

                              1.9k

                              Users

                              12.3k

                              Topics

                              107.4k

                              Posts