Painted Button?



  • Ok thanks - I tried that
    I already use the LAF method for my buttons
    But I didn't know that you can create different shapes by if-statement.

    What I noticed in your example is that after compiling endless values are created.
    Is that correct?

    Furthermore the question is how would I create it?
    with this method now with a button for example
    to integrate the text On and Off?



  • @MikeB said in Painted Button?:

    What I noticed in your example is that after compiling endless values are created.
    Is that correct?

    What do you mean By Endless Values?

    @MikeB said in Painted Button?:

    Furthermore the question is how would I create it?
    with this method now with a button for example
    to integrate the text On and Off?

    There is more examples On The forum For on/Off Text LAF,



  • @Natan Probably also an early riser 🙂

    If I attach Console.print(value) to a button and press the button it will print once
    Interface: 1 is generated.

    If I attach Console.print(value) to a button in your example it will be generated endlessly.
    Interface: 1
    Interface: 1
    Interface: 1
    Interface: 1
    etc.

    I will look for more examples - thanks



  • @MikeB said in Painted Button?:

    Console.print(value)

    Here it Shows The Correct Value Of Buttons:
    Interface: 1
    Interface: 0
    Interface: 1
    Interface: 0
    Interface: 1
    Interface: 0
    Interface: 1

    Give it a try:

    HiseSnippet 1609.3ocsX01aaaCDVJIZa1aYXEX+.D7mb.zLDkjsjVPQSyKtHX8EikttULLTnHSayEYICY5jFTDf8Sa+j5W2m1tijRVR0MqMEUtI0jO7t64dgTGyn7rX5xkY4Z5sd90KnZ5eiwYWmxmczrHVp1oGqo+sFOIZImlaJm5vqWDsbIcrlt91OBmPu0NZhm29fCiRhRioqmRS6EYrX5iYyY70yN5fehkjLLZL84r4UVs2AmFmkdTVR1JfOaaXqsHJ9hnozmFgKaKCM8u3jwLdV9Y7HNcol9NGlM95ylkcUpb8ufsjcdBEGPzNCTjb5gYIiQFiypczLVx3QE98RMPKiVGE1VFE9dimvFyJmecz36D.lqknZ7Peqaidjpzy9Cmd5Un2NR5cOiyhyYK3qQPt80FmlBIpIQPJnJsjqUaq+okwQYvJR48lGcAcXNLnThtCrssL6aau2961F+.ohkbyjnIl227jzorTZu3bJ3XOJI67nDoRebV1EOLc7PJMoagf3mKixMGkcEM+vUbdV5wQ7HPMEVWpmQQ7YBgjVpTDXg+t4tsIDaKhcnkiceKu.KRPn0.eKhmK7y.XVabXH.X6Ai7fEDfyLXfUXIrWeq.2BDRePgCb2LVHf0GfHJsVGcPfkucAJwKzhP7KAscfgAkntth0qPwQddUTrumkqsvdBUY46CfNBBEhiIgDqcaKLJ3FDz+csJFBZQIousvevfiTuNnkvepqYew.PMCJhfNtfR7I.lJp3X0uO.JVoGf6ThITK3JgXjvS4NtN.rLWDhZBHRff+gdnyUXx5X1VU4ZCPBxHmfBOER8NpDcfXh9D7epnjiy.AEUDRvOO6JAXHMRPQEFi3HyUEImvPKOuBPvs8c2LDwEJFbJwrCZhigjZVsALlvrKJ0FHcUEkCcrB6W.QHCjEZdEQBv8EELE02NDL5PJCVPc.woj1h0A9X.oDz1uHRN.HjqeIHFY56TslwyQjuTKvAKnbbJRgnS4UjCvMiAtEYdGfgBEOPxAbF+BPb2SnU.obKqefnVjXWZDrfKjnxsNdtElb21MfqW2z.zAcn0aPvu5rdqUfs5nAUb5VNEAOlg.n8KcIaUAoWY5eivkmAUCEXXe+BTGwwCUjrrp.8FwNAIxtsqfEJBYhfteCwfS27KmulopgTihnGrQTOkwpAJN9JrDdCDo+F3eiT0lba4diZwpBaAYdUv98mGfsXDHaB55Of2Zz30K8RxhFCuRaNNnq.r5Kj1sM7lrd4zoLrWlgqRi4rrztcFmGc0yylNMgJUUGKyIEfSsLyN+O2a21uAk2Ddv2QguHCltWD7Rr8kSK+MahYWDfSeM27922rifDc1Sh9F4+gOS6MA5+4gIIcsess5Yu8MqtfkTtrOHXICGF3iefkTZq5eCs5XnKCyGzPT+9CCwO68ilc5recAtLJYEsgD37LNctbHooXMcAwavajGrJCN6oj7FL5cS81Jv.oTFRk9BlhDY9hrTXP2NJ7NRIYoIPKHkIGyrTENJbdVR23BIsLEtlLu0BfWlkP6sHmAJUh.J7FgR+eLrLxHT+QQIImCci1socqVjUgbOMiSeVZ28Z+l1sZeSaylPSlrQLkRSn4aDF6WN+1Dra5p4mSyKBAEKDZbrdmoFu+NSq13brL9TYgYomlx3OaAM880uplJnBcttshUv23h9V+VUeqxPnFCZOskgJdpInb06Nn8QHtyml3tME+sOP6WNEqmwFvUdD3kKn4bFF.0OldIbyFY63sLNlt7Bd1BgKqpizz+xO.m90qM4udv0kCN3UGbEaLe1ZzSOXFkMcFu5L3IMfYLDaAQ+8ivzNUL8eM6VM8KeGS+xOIS6VwzGb4sY5+97llFlogoe2aGA2QKa7pjHd8Ktg2VUA.6YpcCI7VPoKY7qqV.7Y41benz8dFiX73YaluasA9B0oet4q5tw6ZbxjIzX9Zxtiwve6y+Eg094rUbV5zmDwyYPEjwSWM+L30TwTfIoozD7bM8svM9xw13XLxbFMcrXv+BOJPBNVWARJ.0lGEmm8pX4IG3su+JwL.mRE+QHZY7DbrY4wUFF18r0lyFydUbLFJ9Af6aVFm6fLt2AY7tCxz+NHyf6fL92AYBtUYv+dLObEOatbaBLwnSDGbqqeRZDTkIpH09O.zJ7kzA
    


  • my mistake - wrong value used - Is still too early here 🙂
    Thanks for your support



  • @MikeB said in Painted Button?:

    my mistake - wrong value used - Is still too early here 🙂
    Thanks for your support

    No Problem👏 Glad to Help



  • @Natan said in Painted Button?:

    There is more examples On The forum For on/Off Text LAF,

    So - now I've read all 532 posts on the subject of LAF.
    In none of them is there an example of a LAF-generated button where I can change the text to "On" and "Off" in addition to the color change.

    You are sure that this is possible.
    Before I continue to search here for hours without success.

    laf.registerFunction("drawToggleButton", function(g, obj)
    {
    
        var a = obj.area;
        
        if (obj.text == "Power")
        {
            g.fillAll(0x00000000); 
            g.setColour(0xFF878787);   
    //Text "off" visible 
            
            obj.down ? g.setColour(0x75F9F9F9): "";
    //Text "on" visible
            obj.value ? g.setColour(obj.itemColour1): "";
            
            g.fillPath(PowerButtonData, obj.area);
        }
            g.setFont("Arial", 15.0);
           g.drawAlignedText("on", [0, 2, a[2], h/2], "centred");
    
    });
    


  • @MikeB You need to use lots of 'if' and 'else if' statements - ran into this the other day, I'll grab a snippet one sec



  • @MikeB

    HiseSnippet 1296.3oc6Y0yaabCFlmsufHkp.azBzUBMDHA3ndR1NMvFFMV1RAN0eHXIGTjk.p63IypSjB2QYaACu0otkr0gNTfLzwL2eAcon+A5Tm5XmaQQJ4wS5NYcVQVAwEwUmArDe+f7gO7k78zKq3xLwddLWfVhZcaiAZejd0tT9QadDhPAauEP6t56h73XWnRTwtsQddXKfl1rOVJPKwb.+m+7KJhbPTSbnH.3oLhIdGRKBOTZkG8kDGmxHKbMRqHVu7i11jQ2j4v5Hvyr5Ff1HylnF38PRylQGncqRVDNysJGwwd.s4Jxr5V8H1ITk8Ok3Qp6fkMxCpJ5Hk3xLGKIhkRAadDwwpRu4sGPzKUBYgYUrvmnuKwhzWdHaLuuBXnGQ4CsYFE7x+1gmQbvSKB7lSAuEzqZ5RZyC0Hw1cz2lJVnrQhkfnvRYKXl+XA8MYBKn7bsPMwkcEM56QlGXXrHbECirqkJYpjel7AtUoxab3N0fEOrVs82KURwxiGGdLxE5frgqCKQaPn3bltXwD9wNr5HG0fsCi0bCpUYL1IirCElmyCyUlTVLtYRuQcry8O.2niCxM8hv7OLWvPKs0E2fHC5J2gZxILZlzVtnSpwZzvAWrCmynBWr6orwhPV8uNapjmkJILxirEwFlQnLGGeJGt95vzJ2ymNqxV0+OCFySXmQr86iiQNcvxNwHantKLlMjySULruO0anZjcsncnxRaw1fCXcnhU+CvlbDUL67cBIHzEgEj7wk02FmVtbokj+EqUijiGzZIytgCoAEaUSPR8YKeRM.JoMEQMtXqzhoQn+mGsqFAaAu2876K1wX2wm4HbbKUyBCLpWWbmKA479kztbJK+jPS4uwDiMDa0izTefc7vW1F6BWXi83v1evrc1AVD0EQu91JOMH8JDjNl4N9v7zvqsLIiHdaxXNIB5uo8+SDmk3EOm9hJQXoAxkDIUxM2DF+m79eSSZLMowzjFSSZbiMogrJEmmcsd0e.xn6w338oYxl7rjIRddR3EUYaGqNY4XbYNNX2XUKKOl6nbLCsSq5X2Eg9g68MDnM2fEh5NiWgnLUUGJhgL51TBe+13f1QqjVuYcOsFf9S1nhBmiQk5O0hwrPQCWILPP0qjkrKvbgob+Jhc2fJho9Qf.h.iIzCJ0CvmchVURvUv8Buatuz6l6KGi6Gt8VHNRVYv.BQPRswtbhboVaK7wDSrpNgIz2B60jyZ6yXsZynR5S61iAmcJPSWyRLZckegJ9Ru85Bqt027qI9KITBSvHkJNtvdPoEjhmed9eKEGdlpTZylm7l.13J.rBJf8wZA.icAfA.e++LLv9tWA9wX.1m9hWDCvdxSNXB.1RJf8y8XreeHPr5pm3yNQg6qR95eJFf0oyuECvZ29am.fsrBX18XrU0FDBIRvObXF6ku70wsT9rm8Cw.rUV4WT.a3JUOu9tLKwAz7AKht7lCBTHNPafpUKqHM0iv6F8lEtBUV2XrK7+3B2EzqP3lGEOdmIF7J1Z99FuA2SQJ8R11hjqgfcN8xe0jdoDWAnHRryIzF6h3tDY70dcZUUDMXhEHgRE+pJYn1LxXUUaCYaIyTESs7a7FwSfx7x1ZAJy2SInExzk8bS0gkxaB419RDXh5egPIz2U1F1+.dccibFfVDKxyMMkTw8EXOdeJLA9rzD3yxSfOqLA97fIvmOeB74gizG4cisQGNqkZahPPkR94pzzJQQhnL+HRv+RIU9zg
    


  • @DanH Nice demo. You could simplify that code a little (Google DRY programming)

    const var laf = Engine.createGlobalScriptLookAndFeel();
    
    laf.registerFunction("drawToggleButton", function(g, obj)
    {    
        obj.value == 0 ? g.setColour(obj.bgColour) : g.setColour(obj.itemColour1);
                
        if (obj.over && !obj.value)
            g.setColour(obj.itemColour2);
        else if (obj.over && obj.value)
            g.setColour(obj.textColour); 
        
        g.fillRoundedRectangle(obj.area, 2);
        g.setColour(0xFFE3E3E3);
        g.setFont("Abel-Regular", 18.0);
        g.drawAlignedText(obj.text, obj.area, "centred"); 
    });
    


  • @DanH
    Thank you. That helps me very much.
    This is exactly what I was looking for.

    But much less lines are enough for me - see snippet

    HiseSnippet 1032.3ocuVs0aaaCElJIpaVctXEn+.H7S1.tdxoWVAJBpsisJLVRrQsSwF1CEzRTxblhTPhNNdAAX+N1y6G3dd6grCkriraUxJ7tP+hOW4GO5b9HGFKcoIIxXjQowKinHiuxbzRgZ5wSILApeWjwiLOkjnnw3LUcVFQRRndHCi8eqVgQoCPoqe+McHbhvklqBgduj4ROgExT4ZG156XbtCwiNlEtg2OuUeWo3XIWNGvy9l1nHh6LR.8Lh1s8LQFOnmGSIiGoHJZBx3fNRukilJWHx7+8rD1DNUKzDMBRTlZGI2SiXsVzwSYbugqO2IHHKCyqB6mUEdh4oLO1s5yqFecpAbdDaVOL169fWyMgmcgvytH3YrA7NHCdO1bjaLKRkaQisGZ1W.en7IvmfMgUlun8908MOVBdHTMBIynNwfvsQT8k110wuv1t1qKaU15azKb2dNsO+jw3NmOd7fyJaAedRT3KHwXNwGeDtmHfInMbiovA9sb4DBOayNQJm0V34Po7p5DBt2HgpxbwA12pUZOgxe56nAy4j3J0wG9pFq1Zsuwz.ltoyYtvUwjhpU7hIKFKCB3zNyUJo.Bweswf5X4jepVYqqv4qxVXLyGWErzPQuTgO5HbkH4BZbkZWk6hdEnwVgnpYJpvErVGqdSR2iKH74zZWkq+1Lm0Qm5zjfLAcN+XO8gghdbNKJgl5KApp5JxckO6Kcb58L8uO0Kc0pMmEHndigyd0JC78qjVkRSacbEWnMHl5UAPRdvWm+WJOg92bXXJZXlXy++OOh653r0oIS35zuWWW60q6XvRwYREcfnZMqqrJYcsE9iM46WnM8.TrjyowEZVSnEeeAVULObBMtNNqcYsivj81TGl2M0wlLatYyya3nTzWvTChnh6huCshDPSsrBUfqpThkGshXIaFCw.9CKyIJwP8bCJEyaxtiNueWhhrNSPRgMJhFqX5yfQW5E.6eFkUIytzjYJYTpugQRgFBFO7yYeuLeO+gVKuU3W9wVqmm.cO.g9s+PqNusTqs7Oaby1ZOTqdvMn+TqVyLj67rYKRcdAySMMeS62ZJkELUsoFcfHiuvLkQAtS6S3ngaJjd.MhZ6qOz2Ytx.zXrEOslKVjvTK27N0+w2oTXKvmIber4PlxcZw3cuBvKzI7eMdWcCcYyd99TWUNXOvz46+2853Bgx6jyULQvoDULCZLMOad3Hn8wkBHQH.ZSPmwd5wrLYasrtxLhJ7REtAVqL1TKarxXy0FQgD2X4GbyFN0uA3KS0.XRj9TnRvax.Yby0ijll1MrQgvSS9fqqtT7T.6EGyg6PLOaGh446PLuXGh4k6PLe6NDyqt2XzuJr8bkLLaLATLrWJ0ngQOAA5xR6HQ+EPWnavG
    


  • @d-healey said in Painted Button?:

    @DanH Nice demo. You could simplify that code a little (Google DRY programming)

    const var laf = Engine.createGlobalScriptLookAndFeel();
    
    laf.registerFunction("drawToggleButton", function(g, obj)
    {    
        obj.value == 0 ? g.setColour(obj.bgColour) : g.setColour(obj.itemColour1);
                
        if (obj.over && !obj.value)
            g.setColour(obj.itemColour2);
        else if (obj.over && obj.value)
            g.setColour(obj.textColour); 
        
        g.fillRoundedRectangle(obj.area, 2);
        g.setColour(0xFFE3E3E3);
        g.setFont("Abel-Regular", 18.0);
        g.drawAlignedText(obj.text, obj.area, "centred"); 
    });
    

    @David
    Now I have already shortened my example and learned from you. (see snippet)
    But your version is of course even more elegant



  • @d-healey
    Whereas your example concerns the general LAF button
    not a second or third one which is defined by "(obj.text == "XXXXX"){
    is created.



  • @MikeB Because all those buttons need the same code. If a particular button needs different code then it's time to use an if statement.



  • I understood that now - thanks


Log in to reply
 

14
Online

1.3k
Users

4.3k
Topics

38.5k
Posts