Moravské přístroje, a. s., zdroj: https://www.mii.cz/art?id=952&lang=405, vytištěno: 20.04.2024 1:21:56
Hlavní stránka▹Novinky | 25.3.2019 |
---|
Nová verze systému Control Web 8 umožňuje v Grafickém editoru vývojového prostředí kreslit statické i dynamické obrázky ve virtuálních přístrojích panel a drawing. |
Jednou z mnoha nových vlastností nové verze systému Control Web 8 je možnost přímo v Grafickém editoru vývojového prostředí kreslit obrázky ve virtuálních přístrojích panel a drawing. Kresba v přístrojích může být statická i dynamická, kdy animace kresby se odvíjí od hodnot z běžící aplikace. Kresbu lze editovat v Editoru kresby, který nabízí řadu grafických primitiv a nástroje pro jejich editaci a umožňuje i import obrázků ve formátu SVG. Na následujících příkladech si ukážeme různé možnosti využítí této nové vlastnosti systému Control Web 8 v aplikacích. Jednoduché použití kresby pro dekoraci přístrojeV prvním příkladu si ukážeme využití Editoru kresby pro orámování přístroje meter umístěného v panelu. Editor kresby spustíme stejnojmenným příkazem z menu, které se zobrazí po stisknutí pravého talčítka myši nad virtuálním přístrojem panel nebo drawing. V Editoru kresby nakreslíme rámeček a nadefinujeme jeho vzhled. Protože editace kresby je možná jak v Editoru kresby, tak i přímo v upravovaném přístroji panel, je umístění rámečku kolem přístroje meter velmi snadné. V dalším kroku doplníme do kresby text, který bude sloužit jako titulek přístroje meter. Po uzavření editoru kresby pak dostaneme dekorovaný přísttroj meter. Jak bylo uvedeno dříve, kresba může být i dynamická, tzn., že objektům kresby může být za běhu aplikace měněna jejich poloha a rozměry, mohou rotovat nebo může být měněn jejich vzhled. Pokud bychom tedy např. chtěli měnit barvu rámečku obdélníku kresby v závislosti na zobrazované hodnotě v přístroji meter, pak toho můžeme docílit následujícím skriptem. procedure OnActivate(); static LastColor : longcard; static Color : longcard; begin if Value < GetLowLimit() then Color = system.ColorNameToColor( 'lcyan' ); elsif Value > GetHighLimit() then Color = system.ColorNameToColor( 'lred' ); else Color = system.ColorNameToColor( 'green' ); end; if Color <> LastColor then panel_1.SetStrokeColor( 'Frame', Color ); panel_1.Paint(); LastColor = Color; end; end_procedure; Rámeček kresby bude za běhu aplikace měnit svou barvu podle toho, v jakém pásmu se zobrazovaná hodnota v přístroji meter nachází. Zdrojový text aplikace s příkladem je k dispozici zde - Drawing_Frame.zip Vytvoření vlastního přístrojeV druhém příkladu vytvoříme jednoduchou animovanou kresbu, která bude znázorňovat měřicí přístroj. Místo panelu však použijeme přístroj drawing. Obdobně jako nad přístrojem panel, otevřeme z menu Editor kresby a pomocí nástroje Obdélník si nakreslme podklad přístroje. V dalším kroku si nakreslíme pomocí nástroje Oblouk stupnici. Stupnice bude vytvořena ze dvou oblouků a každý oblouk bude vykreslen jinou barvou. Ve třetím kroku nakreslíme pomocí nástrojů Obecná křívka a Elipsa ukazatel. Pro jednodušší manipulaci s ukazatelem, seskupíme oba objekty a vzniklou skupinu pojmenujeme arm. V posledním kroku doplníme do kresby texty. Takto vytvořenou kresbu uložíme do souboru. Nyní bude potřeba napsat skript, kterým budeme nastavovat vychýlení ukazatele. Procedura SetRange bude sloužit k nastavení rozsahu stupnice a procedura SetValue k nastavení zobrazované hodnoty, resp. k vychýlení ukazatele podle zadané hodnoty. drawing FuelMeter; static Value : real; LoRange : real {init_value = 0}; HiRange : real {init_value = 100}; Range : real {init_value = 100}; end_static; gui owner = P1; position = 11, 15, 200, 200; end_gui; drawing_file = 'fuel_meter.cwg'; procedure SetRange( Lo, Hi : real ); begin LoRange = Lo; HiRange = Hi; Range = abs(HiRange) + abs(LoRange); end_procedure; procedure SetValue( NewValue : real ); begin Value = NewValue; TransformReset( 'arm' ); // Vynulování transformace ukazatele TransformRotate( 'arm', 360 - 270 * (Value - LoRange) / Range, 100, 100 ); // Pootočení ukazatele o vypočítaný úhel Paint(); // Vynucení překreslení kresby end_procedure; end_drawing; A na závěr si uvedeme kód pro obsluhu námi vytvořeného přístroje. control control_1; gui owner = P1; position = 224, 42, 154, 143; end_gui; range_to = 50; procedure OnStartup(); var RangeFrom, RangeTo : real; begin GetRange( RangeFrom, RangeTo ); // Přečtení nastaveného rozsahu FuelMeter.SetRange( RangeFrom, RangeTo ); // Nastavení rozsahu stupnice přístroje end_procedure; procedure OnOutput( Output : real ); begin FuelMeter.SetValue( Output ); // Nstavení hodnoty end_procedure; end_control; Zdrojový text aplikace s příkladem je k dispozici zde - Drawing_Fuel Meter.zip |