How can show my image on hise?

djrecycle

why my image can't show on panel?

Lindon

@djrecycle images take pngs not svg's....

ustk

@djrecycle, @Lindon's right, you'll need .png files. But there's a way to use your vector image if you don't want to suffer any loss of quality.

Open your .svg with a text editor and copy the path data you want to draw (Tip for complex drawing: combine your path in the vector software you are using so the whole drawing is one unique path instead of many...)
Open PROJUCER and use the SVG Path Converter (menu Tools I reckon...)
Paste and copy the converted data (you just need the data in your case, not the variable declaration and consort that differ from Hise)
Then use the data you converted earlier in a panel:
(https://docs.hise.audio/scripting/scripting-in-hise/scriptpanel.html#the-paint-routine)

const var Panel = Content.addPanel("Panel", 0, 0);

const var p = Content.createPath();

// pass an array with numbers to load SVG images
p.loadFromData([110,109,0,245,207,67,128,217,36,67,108,0,236,189,67,128,89,69,67,108,0,
                245,207,67,128,217,101,67,108,192,212,207,67,128,53,81,67,98,217,93,211,
                67,51,180,80,67,123,228,219,67,2,123,91,67,128,144,224,67,0,149,101,67,
                98,39,209,224,67,29,247,89,67,79,60,223,67,36,224,61,67,0,245,207,67,0,
                12,54,67,108,0,245,207,67,128,217,36,67,99,109,128,33,193,67,0,168,88,
                67,108,0,66,193,67,0,76,109,67,98,231,184,189,67,77,205,109,67,69,50,
                181,67,126,6,99,67,64,134,176,67,128,236,88,67,98,154,69,176,67,99,138,
                100,67,49,218,177,67,174,80,128,67,128,33,193,67,192,58,132,67,108,128,
                33,193,67,0,212,140,67,108,192,42,211,67,0,40,121,67,108,128,33,193,67,
                0,168,88,67,99,101,0,0]);

Panel.setPaintRoutine(function(g)
{
    g.setColour(Colours.white);
    g.fillPath(p, [0, 0, 50, 50]);
});

djrecycle

ok thx for information :),, I change svg file to be png file

andioak

@ustk said in How can show my image on hise?:

const var p = Content.createPath();

Looord, have mercy! Thank you for that line of code there. Riiiiight before the p.loadFromData, it was missing from the example in the docs in LookAndFeel, so I was chasing a ghost for around 2hrs. Hahaha.

Thanks. And for the SVG Path Converter to C++ info too, I thought the JS/HTML5/CSS3 paths looked a bit different :)

How can show my image on hise?

58

1.8k

10.4k

90.6k