VU Meter image strip jumps on the latest frame



  • This VU meter works good, except the latest frame. If it comes to the latest frame (frame 70), the image jumps a couple of pixels. What am I missing? The Hise project is also attached below.

    Also is it possible to scale the panel image with using something like scale property (without setting "width" & "height")?

    alt text

    
    const var VU_METER_OUT_MONITOR = Synth.getEffect("VU_METER_OUT_MONITOR");
    
    
    inline function createFilmStripVuMeter_Right_Output(name, x, y, isLeft)
    {
    	local widget = Content.addPanel(name, x, y);
        
        Content.setPropertiesFromJSON(name, {
          "width": 151, 
          "height": 83,
          "opaque": true 
         
        });
        
        // Put the image in your image folder
        widget.loadImage("{PROJECT_FOLDER}VU_Meter_70Frames_00000.png", "filmstrip");
        
        widget.data.value = 0.0;
        widget.data.isLeft = isLeft;
        
        // Set the initial image 
        widget.setImage("filmstrip", 0, 0);
        
        widget.setTimerCallback(function()
        {
             // Get the peak value from the master output
             var newValue = VU_METER_OUT_MONITOR.getCurrentLevel(false);
     
        	
        	if(newValue > this.data.value)
        		this.data.value = newValue;
        	else
        		// Just decay the current value (0.94 controls the decay time)
        		this.data.value = this.data.value * 0.94;
        	
    
        	// 54 is ~0dB which is
        	var index = parseInt(this.data.value * 54.0);
        	
    
        	// the yOffset is index * heightOfFilmstrip
        	this.setImage("filmstrip", 0, index * 120.0);	
        });
        
        widget.startTimer(50);
        return widget;
    };
    
    
    const var VuMeterRight_Output = createFilmStripVuMeter_Right_Output("VuMeterRight_Output", 220, 166, false);
    
    
    
    

    VU.zip



  • @orange - hmm looks like it's maybe in your image itself:

    HiseSnippet 2365.3oc6Z8zaajaEejsYRjx5Dmzj1BzKD5PgRpqVI+mr61fsVw1xINwNRPxw6tmLXlgRhviHmcFNNVHHE8aQQ6o8TO1OC4CPKPu0K8Pu2KEnmJPAZejbFoYjjclpljFWDcvV7wGe726Oju2i1M8E1zf.guUt7GLviZk6SPsGvk81pGgws1caqbEPG9L79TI02ZyAdjf.piUtby+P074xufk9yeaiMItDtMcDIKqCELa5dr9L4HpMq8Dlq6NDG5Ar9I3dsZ6ZK3aIbEg.VlGUwxiXeLoK8oDEaygrxco5NLovusjHoAV4VXSgyf18Dufa3+PV.64tT0fpVsAAYHuiv0QgXEUqs5wbcZFqyAVV4PMGYAl2XAtEZelCaH8QVhkzSfGshj1ibycdvqZR3UI6vKWB3sfAd2.011m4IGMiBaWEsKGbQcHfKHIrL7ZM2pWFsk.3fKK2mbLcGeXvvUT5dUprLd8JUty8WrvhE.GQfDeBwGe3yNZ+5GTu0QMd1AGseimt6AMZg+RrNBobWprdmNTaYohSiuhFgsXAF2kwo3NgbaISvw19TvDsCyseaI.tCC0AWG0h0sm7nFgRuPYIN30WFe5x3AKiYA6Q6HuyhEd4hEx6JrIt3WvbfcGPRrNQbbZR3T2DKTs8X3i4mwLFPUFNOpujQC.qP+G2twSiV0KMrhwEA4K6U7mgqtd0kwCo1ipfHP9yWc4gDEdjuMjBDk9gzXdM+5Uogvm9o3lgRrrGEy5CQ1XFGO.B2iF0QEI3aX0nekcEDmcUSVp3Ka1pwiqu0AGsSi81tdqWor3Zy1mUYGe.8AGUQ8orGuawkwE6.V2.k0sXZLDIXGhjT9DhKf3uDWobk6O4rFqNLs4KiqIsoQZBmIYfGwnCoDCXpi.+HzrLFBzpLULArqtRveKhq6ygy9khCXJcGCeCcOFD7vHD3QIGiM5RGvepo0mD.1FrPGLkXYpXZN8EGFo4wAEv1uknumfCCJUbWNrnCEtg8oEuiZNM6kzf1Hq7Q+h0ozPo8ygMlEjvxFg574GiNruwKJxLjm5FPi4FzrGGBG+bn1jAZkwNz2G.VjNVpR4uXMLbDU5KbCzLDwJX7Nm8bbJ2EqDz8GpPQeA190WC743eQEmMwunGytGLJZRk4iwcnmBxyi3GPgaPJMofWesxCcwojrBrCZzoC3pUagQT2EaNW0nyNwgIQqPK4yLJJd0UWohZ6xO0ybwwVRhuI5pz5CglOUF5yiXAn8pn6qRb8m4poj2LAZdVt+p3TVJ.6UVA.d06cukwcHfOO9FxIuiTvSDEtkwYWxNNFcYbbDl5JworUJqlIp0v38OC1r6Q3coN5X67v1DHbok87YpiAvsS8n9zxk0WgXLNY4.SfZNMfGdRdZZyHcOgR+Tgj1.NvW3kExW3UEviOUmNSctHQ5Bt2oMswweNKrDOr+yo9wl0XFgTtoyoiN6b5IK4v1XkRvnx.vjM7n7yJSuUjoEx4OWDp.Vk5L9WKJi+lgRofawfD64QlAUszPNYUWVm0xa6xfDL5kuHJgCIkH9k252822v5Y6tMbfVU+QDrFkyDnsM8DnvNS0H4QaSCNVJ7fsaXHgUtqX15EiqUQkaVuy2FMk3PqSAaat+Lr8CTe42BeQmAFD+k9UQZk4RBEk1QTLYdUKHGLpO4TkJ7G98pO+yMrR.l7YvLd5HSnWsACG7cmTSROUppB9A9d3GA4ns7hca65nDJPm1sKi.wIUghVUIiA0SM2kPZ9iUEiDe8yp4P6PBcMGPSVBcRLe4L56Fg6uqeBb+5uMB2WAEw3T1zZE9SWuVjc627qUe9GaXMYAmPYuBmPWkBlrVXUC.QS.GlRUzopvRd.SNHo18No.4rB2afZxj18lNdmaJ3UcN7cLdiZ2XQjoJ5QfcAzNe864dKtxvl+X88boOLFJeezzJs+rZDr1pq9W2XapKIkg7qRE+a8M0lRqh6xOAtdoovk3OtaX9z597Y6N3onuKj4XEkJguvDaeSj1jeQBv5PhKN.dIDj.6C.31BZngw6tOAp6Tkx7og8aCMPZSAnxgLrpRTxMmpD.y3JpwJ.0lxczC9WvmnIqFm4TMY03ISZRtswjbUzWQNgp64WaMtsdbGgeenGLN02j46rean+XVeaHuL+1PMrk.DNvmvC7DAzpIk7XysRx41FJ4mmlcCoTboTuc.0KAeWoVLwURRDBKRILXbJIsOKQcE+kMpyIfSuMEzFmFA1fxprcIiaZFBsEnOcTM4BGQdkjjeDw2A7K1m28kKjs6KeC4Jtz6pmIa9rcv3Mj9ZXpzDEiowxXkmkBIusRrjnz8uWFJc+ZHCJhHk852SHiEQsnPeV+GKhDkQdc8sGRpWDswDxR0xhPtJRIAMVlMTrjV.sOlcFvPWT7azb.RQ3KeBcPv+MVDPY7nTmmvEOebA7imzZrTj.fZ1etXSwoZQbSTaJzSBbW2PxYWgRUiu4VrVp1ymMsIOpcuvNcboyVD1UQlKqNfQOOUXAi.tYp8uIzyuVH2BLG8YG.szjXhIfi5sirx8iPUuW4o+wJ662gTWgMjKNy6WmexlOnb4u3IaWt7pgMMiy79cSzdTdWYuruaGq1sCeLraesnoYrU1BstAJJucapKzsfHKGUlpf9AHSS2ukD2MP62rda06qEIvILAY7ry0UBpN24LDSkZYIrMpk6IC4eu0V6rmPatlS7Giaon9wpCsG4J.Jw06q6kOlZ57Z6K3BudBNKUYAsnPMic6RSUswTUnGHkp.4DU4zBBQHAIrmEqsGiSI9fchNi1hpYO4944u9gHCbwpJF+vpghqaf8kQO3Qa2tUTmk5uieW531Jz+DZ5BbsIClf53d40pYnrGEfVRF0mmFWbCI34UqcXfLU89eyqmHfAWqts3cWzBJiQKKlLZ4C7dNuVLVMdjOrA6mfzgEWDrqWGEEvdgvvdMTzYoKBl1y8QVm+h1ir91oyzy5gUuVDArhR0y4AUuasO9fpe7AU+3Cp9+COn54aR1mc5EGOHzEYf8JX8E93+2ei+6CG46i8nOw1WbT7+cOf05JZJfdy0+ePlGsuZLd3e2eDpR4JV8YNrirsUY09oUsrl9ZVYFVypyvZVaFVy5yvZt2LrlOaFVymetqQ8V2OHTJ5ah+ABMqq+mmHWNyKnoOJX8uAjDFlGA
    


  • @Lindon said in VU Meter image strip jumps on the latest frame:

    @orange - hmm looks like it's maybe in your image itself:

    Image is ok I've checked.

    Can we give a lmit for the read value? let's say no reading above 2 dB?



  • @orange well I removed any dependence on the volume and replaced it in your timer with the knob value. As you will see when you move the knob it applies a "virtual volume" - so you can better check your timer code....you will see when you use it your vu meter is jumping about all over... so either your image is off - or the code you are using in your timer is the problem.



  • @Lindon Issue is gone when I set the height and width to the original image sizes.

    What about scaling the image? How can we scale the panel image down without using width and height? Because scaling down the image makes it a little sharper.

    HiseSnippet 2365.3oc6Z8zaajaEejsYRjy5DmzMsEn.ED5PgRVWsRNNY2sAashsky5D6HAIGu6dxkYFJIBOhb1Y33XgfzuG6sbpeF5w7AXOzyE8Pu2K8ROTfBz9H4LRyHM1YV0jz3hnC1hO93i+d+g78dztkuvlFDH7sJTb+gdTqBeDpyPtr+l8ILt0NaYUXQzAOAuGUR8s1XnGIHf5XUnv7OPMeghKXo+72WeChKgaSGSxx5.AyltKa.SNlZq5Oh45tMwgtOaPBtWq9N1B9lBWQHfk4QUs7H1GQ5QeLQw1bHqBWngCSJ76HIRZfUgE1P3LrSewy3F9OfEvdpKUMnlUGPPFxaKbcTHVQ0Zy9LWmVw5bfkUATqwVf4MVfOFsGygMh9XKwx5IviWQR6Qg4NK3UKI7ple3UHA7Vv.uqg5X6y7jimQgsKi1gCtntDvEjDVFdslasKh1T.bvkUFPNhtsOLXzJJe2pUWAempUu48VZwkVDbDAR7wDe7AO4v8Zrei1G17I6e3dMe7N62rM9Kw5HjJ8nxFc6RskkKkEekLBaoEYbWFmh6FxskLAGa6SASz1L2Acj.3NHTGbcXaVu9xCaFJ8Bkk4fWeE7IqfGtBlErKsq7lKs3yWZwhtBahK9YLGX2AjDqSDGmVDN0MwBUaOF9X9YLiATkgyi5KYz.vJL3gcZ93nU8bCqXbIP9x9k9M3Uq84qfGQsOUAQfbsUqtxHpBOx2ERApR+PZLyle8hzX3S+TbqPIV1mhYCfPaLiiGBw6Qi5pBE7MrZTvJtBhyNpIKW54sZ27gM1b+C2t4ta0n8KTlbsc6yptsO.+fCqp9Twi2qzJ3RcAyafx7VJMFhDrCQRpbLwEP7WhqVo58ldViYGl17kI0jNzHMgyjLvkXzgThAr0QfeLZVACQZUyDS.6p6D72j359T3ve43Hlx2zv2H+iAAOHBAdTxQXitzEbnZZCHAfsAKzQSIVlJnlSe1AQZdbTAr8aJF3I3vfxk1gCK5.ga3.ZoaplSydYMnMxpXzuXcKORZ+VXiYAIrrQntXwInC6a7hhLCEotAzXtAM6ggv4OGpMYnVYrC88AfEoikqV4KVCCmQk9B2.MCQrBFuyXOmjxsvJAcuQJTzWfs+NqA9b7uupyF3m0mY2GFEMox7w3NzS.44Q7CnvUHkmVv2YsJibwojrBrCa1sK3pUagQT2BaNX0r61wgIQqPK4SMJJd0voQ01ULyybwwVRhuI5p7cFAMepLzmGwBP6EQWXk39OycSIuZBz77bAVoLVJ.6UgaNv0t6cWA2k.973qHm9RRAOQT3lFmcY63XzUvwQXp6DyXqTVMSTqgw6cJrY2mv6Qczw1EgsIP3Rq34yTGCfam5S8oUpnuBwXbxyAl.0bZ.O5jbVZyXcOgR+Xgj1DNvu3yWr3huXQ7jS0salyEIRWv8l0zFG+Yrvx7vAOk5GaViYDx4lNoN5zSpmrlCaiUJAiJC.S1zixOsT8VQlVHo+bQnBXUpS4eknT9aDJkBtECxrWDYFTyRC4jkcYcZKuiKCRvnW9RnDNjTh328G+k+i0sdxNaAGnUEfDAqwIMAZaQOFpryTNRQzVzfijBOX6FERXU3Rlsdo3hUTIm067MPYDGZcBXaK7Wfsen5K+A3K5Tvf3uveNRqLWRnnbRDESlW0BJ.iFPNIREd0O7C+q0sR.lh4vLdxXSnW8giF7xiqKomHUkAeeeO7WA4ns7hca63nDJPm1qGi.wI0fpVUIiA0SM2EPZ9iUEiDe0Sp6P6RBcMGPSVCcRLewb56Fi6WNHAte02Eg6KghXLiM8ke+2+OWercSOzZ5JNg5dENgtJELYwvpN.hl.NLkppSUkk7.lbXRs6sREx4EtWC0hIs6mMdmKC7pNG9VFuQ8arDxTF8Xvt.Z6uYVatH6dep95Zt3Ri59iMvyk9fXn7SQYUa+o0IX8ae6+15aQcIoLjecp3equsdF8JtC+X35kVBWh+jtg4Sq6ymOcOC8cgbGqnTI74lX6qizl7yS.VGRb9AvKifDXuG.21PCMLdu8HPcmpTlONbPGnARaJ.UNjgUUhRg4Tk.XFWUMVAnNTtidv+F9DMYs3LmpIqEOYRSxMLljKi9ZxwTcS+ZqwMzi6J7G.8fwo9lLem9iC8mx6iC4k6GGposDfv99DdfmHfVKojmXtUSN2VPI+7zraHkhKk5sMndI36R0iItZRhPXQJgAiSIo8XIpq3utdCNAb5cnf13zLvFTVksKYbSqPns.8oiZIW3Xxqlj7WQ7c.+h8Yce4O5bEY9PTW3s06jMe9NX7ZReMJUZhhwzXYhxyRgj2TIVRT59OIGkteEjAEQjxe86IjwRn1TnOqezhHQYjWUe6gj5EQaBgrb87HjKiTRPikYCEKqEPmiXmBLzEE+ZMGfTD9xGQGF7eiEATFOJ04QbwSmT.+posFKGI.nl8mJ1PbhVDWG0gB8j.20Mhb9UnT03atEqsp87YSaJh5zOraWW5rEgcYj4xp8YzyREVvHfqmZ+aA87qExGCliAr8gVZRLwTvQ81QVE9EnZ2sR1erx+9c.0UXC4hy8908S139Up7EOZqJUtcXKy3bueWGsKk2S1O+61Qpc6fGB612HZYFakuPqqghxa2g5BcKHxyQkLEzOCYZ59Mj3tFZuVM5ndesHANkIHmmctpRPM3NmhXpVOOgsQsbOcH+6r1Zm8DZy0Zp+ZbKG0OVCn8HWAPItdecu7wTSmWaOAW30WvYoJKnMEpYrWOZppMxTgtuTpBjSTkSaHDgDjvdVp9tLNk3C1I5LZKpk+j6mk+5miLvEqpX78qFJtpA1WDc+uZqNsi5rT+c7aSG2lg9GSSWfqMY3TTmzKuVcCkco.zRxn97zjhaDAOu5cBCjop2+ae0TAL35MrEu8hVP4LZYojQKum2y4Uhwpwi79MX+HjNr37fc8pnn.1yEF1qfhNKcdvzdlOx57m2dj02LcldZOr5UhHfUTpcFOn5sp+gGT8COn5GdP0+e3AUOaSxdrSN+3AgtHCrWEquvG++9a7eW3HeWrGCH19hCi+u6ArVWRSAzat9eDxhn8Tiwi969iPUqT0Z.ygcnssJq1utlkU1qY0YXM2dFVyZyvZtyLrl6NCq4ylg074m4ZTu088CkhAl3efPqF5+4IJTv7BZ5iBV+GW8fk1.
    


  • @orange good question -maybe some combination of panels inside panels? - I never do this "rescaling to get a sharper image" thing...I leave all the image processing to photoshop (or gimp in my case..)



  • Wow! Setting "width": 151, to "width": 150.9, issue gone.

    Since the strip is vertical, at first I thought that the issue was about the height value, but it was width. So weird...



  • @orange - glad you got it sorted.



  • I encountered the same issue and ended up setting the index to Amount of Images - 1. That worked on my end. (basically discarding the last frame).



  • @orange Could this be globally related to the decimal issue I'm seeing in other things?



  • @dustbro Yes it could be. This decimal sample delay issue right?



  • @orange yup



  • @orange Can I ask a noob question pls:

    // the yOffset is index * heightOfFilmstrip
        	this.setImage("filmstrip", 0, index * 120.0);
    

    What's is heightOfFilmstrip referring to?



  • @DanH said in VU Meter image strip jumps on the latest frame:

    @orange Can I ask a noob question pls:

    // the yOffset is index * heightOfFilmstrip
        	this.setImage("filmstrip", 0, index * 120.0);
    

    What's is heightOfFilmstrip referring to?

    heightOfFilmstrip value is the exact height value (in pixels) of the each frame in the image strip.

    Below height value is for the final resized look.

    Content.setPropertiesFromJSON(name, {
          "width": 151, 
          "height": 83,
          "opaque": true 
         
        });
    


  • @orange Oh right, I get it now, that's what confused me! Thanks 🙂


Log in to reply
 

12
Online

1.3k
Users

4.3k
Topics

38.6k
Posts