{"id":26323,"date":"2026-07-01T16:16:26","date_gmt":"2026-07-01T14:16:26","guid":{"rendered":"https:\/\/www.astor.com.pl\/poradnikautomatyka\/?p=26323"},"modified":"2026-07-27T18:32:34","modified_gmt":"2026-07-27T16:32:34","slug":"wyrownywanie-elementow-graficznych-kurs-industrial-graphics-w-oprogramowaniu-aveva-odc-5","status":"publish","type":"post","link":"https:\/\/www.astor.com.pl\/poradnikautomatyka\/wyrownywanie-elementow-graficznych-kurs-industrial-graphics-w-oprogramowaniu-aveva-odc-5\/","title":{"rendered":"Wyr\u00f3wnywanie element\u00f3w graficznych | Kurs\u00a0Industrial Graphics w oprogramowaniu AVEVA, odc. 5"},"content":{"rendered":"\n
<\/div>\n\n\n\n

W tym odcinku poka\u017cemy, jak korzysta\u0107 z funkcji wyr\u00f3wnywania w edytorze Industrial Graphics.<\/p>\n\n\n

\n

Kurs projektowania symboli Industrial Graphics w oprogramowaniu wizualizacyjnym AVEVA<\/strong><\/h3>\n1. Wprowadzenie do Industrial Graphics<\/a>
\n

Edytor Industrial Graphics<\/h4>\n2. Edytor symboli Industrial Graphics<\/a>
\n3. Zaznaczanie i przesuwanie element\u00f3w graficznych<\/a>
\n4. Grupowanie element\u00f3w graficznych<\/a>
\n5. Wyr\u00f3wnywanie element\u00f3w graficznych<\/a>
\n6. Zmiana orientacji element\u00f3w graficznych<\/a>
\n7. Kolejno\u015b\u0107 element\u00f3w w osi Z (z-order)<\/a>
\n8. Dynamiczna zmiana rozmiaru
\n9. Tworzenie symboli na podstawie zmiennych
\n10. Wykorzystanie grafiki SVG w symbolach
\n

Rysowanie w Industrial Graphics<\/h4>\n11. Rysowanie linii
\n12. Rysowanie kszta\u0142t\u00f3w
\n13. Teksty i pola tekstowe
\n14. Wy\u015bwietlanie statusu jako\u015bci danych
\n15. Praca z przyciskami wyboru (radio buttons)
\n16. Praca z kontrolk\u0105 kalendarza
\n17. Praca z kontrolk\u0105 wyboru daty i czasu
\n

Animacje<\/h4>\n18. Wprowadzenie do animacji
\n19. Animacja wype\u0142nienia procentowego
\n20. Animacja wy\u015bwietlania warto\u015bci
\n21. Animacja wprowadzania warto\u015bci
\n

Custom Properties<\/h4>\n22. Wprowadzenie do w\u0142a\u015bciwo\u015bci Custom Properties
\n23. Dodawanie w\u0142a\u015bciwo\u015bci Custom Properties
\n

Style<\/h4>\n24. Wprowadzenie do styl\u00f3w
\n

Skrypty<\/h4>\n25. Wprowadzenie do skrypt\u00f3w
\n26. Edytor skrypt\u00f3w Industrial Graphics
\n<\/div>\n\n\n

Funkcja wyr\u00f3wnywania pozwala wyr\u00f3wnywa\u0107 elementy do lewej i prawej strony, do g\u00f3ry, \u015brodka i do\u0142u, a tak\u017ce centrowa\u0107 i wyr\u00f3wnywa\u0107 do pocz\u0105tku uk\u0142adu wsp\u00f3\u0142rz\u0119dnych.<\/p>\n\n\n\n

Aby skorzysta\u0107 z tej funkcji, trzeba zaznaczy\u0107 co najmniej dwa elementy. W poni\u017cszym przyk\u0142adzie zaw\u00f3r 2 nie jest dobrze wyr\u00f3wnany z zaworem 1.<\/p>\n\n\n\n

<\/div>\n\n\n
\n
\"\"<\/figure>\n<\/div>\n\n\n
<\/div>\n\n\n\n

Zaznaczamy zaw\u00f3r 2, a nast\u0119pnie przytrzymuj\u0105c klawisz Shift<\/strong> zaznaczamy zaw\u00f3r 1. Spowoduje to uaktywnienie funkcji Align<\/strong>.<\/p>\n\n\n\n

<\/div>\n\n\n
\n
\"\"<\/figure>\n<\/div>\n\n\n
<\/div>\n\n\n\n

Najpierw u\u017cyjmy funkcji Align Left<\/strong>, aby wyr\u00f3wna\u0107 lewe kraw\u0119dzie obiekt\u00f3w.<\/p>\n\n\n\n

<\/div>\n\n\n
\n
\"\"<\/figure>\n<\/div>\n\n\n
<\/div>\n\n\n\n

Wyr\u00f3wnywanie jest realizowane zawsze do obiektu, kt\u00f3ry jest zaznaczony kolorem niebieskim \u2013 czyli tego, kt\u00f3ry zaznaczyli\u015bmy jako ostatni.<\/p>\n\n\n\n

<\/div>\n\n\n
\n
\"\"<\/figure>\n<\/div>\n\n\n
<\/div>\n\n\n\n

Po klikni\u0119ciu Align Left<\/strong> zaw\u00f3r 2 zostanie przesuni\u0119ty tak, aby jego poziome po\u0142o\u017cenie odpowiada\u0142o zaworowi 1.<\/p>\n\n\n\n

<\/div>\n\n\n
\n
\"\"<\/figure>\n<\/div>\n\n\n
<\/div>\n\n\n\n

Aby wyr\u00f3wna\u0107 do innego z zaznaczonych element\u00f3w, musimy sprawi\u0107, aby by\u0142 on pod\u015bwietlony na niebiesko. W tym celu wystarczy go po prostu klikn\u0105\u0107. Tu warto przypomnie\u0107, \u017ce je\u017celi klikniemy w pustym obszarze pola roboczego, wszystkie elementy zostan\u0105 odznaczone.<\/p>\n\n\n\n

Teraz wyr\u00f3wnamy do \u015brodka dwa przyciski Start\/Stop. Zaznaczamy je, a nast\u0119pnie wybieramy opcj\u0119 Align Center<\/strong>.<\/p>\n\n\n\n

<\/div>\n\n\n
\n
\"\"<\/figure>\n<\/div>\n\n\n
<\/div>\n\n\n\n

Spowoduje to wyr\u00f3wnanie element\u00f3w do pionowej linii \u015brodkowej \u2013 ponownie to pod\u015bwietlony na niebiesko element b\u0119dzie punktem odniesienia dla wyr\u00f3wnania.<\/p>\n\n\n\n

<\/div>\n\n\n
\n
\"\"<\/figure>\n<\/div>\n\n\n
<\/div>\n\n\n\n

Analogicznie mo\u017cna wykorzysta\u0107 pozosta\u0142e opcje wyr\u00f3wnywania, pami\u0119taj\u0105c \u017ce w ka\u017cdym przypadku punktem odniesienia jest obiekt zaznaczony na niebiesko. Przyk\u0142adowo przesu\u0144my teraz nieco zaw\u00f3r 1, zaznaczmy go, a nast\u0119pnie zaznaczmy pomp\u0119 1.<\/p>\n\n\n\n

<\/div>\n\n\n
\n
\"\"<\/figure>\n<\/div>\n\n\n
<\/div>\n\n\n\n

Po klikni\u0119ciu Align Top<\/strong> g\u00f3rna kraw\u0119d\u017a zaworu zostanie przesuni\u0119ta na wysoko\u015b\u0107 g\u00f3rnej kraw\u0119dzi pompy.<\/p>\n\n\n\n

<\/div>\n\n\n
\n
\"\"<\/figure>\n<\/div>\n\n\n
<\/div>\n\n\n\n

Polecenie Align Centers<\/strong> pozwala wyr\u00f3wna\u0107 elementy do ich \u015brodka. Przyk\u0142adowo je\u017celi najpierw wybierzemy pomp\u0119 1, a nast\u0119pnie przytrzymuj\u0105c Shift<\/strong> zaznaczymy przycisk Start\/Stop, klikni\u0119cie opcji Align Centers spowoduje wyr\u00f3wnanie pompy 1 do \u015brodka przycisku Start\/Stop.<\/p>\n\n\n\n

<\/div>\n\n\n
\n
\"\"<\/figure>\n<\/div>\n\n\n
<\/div>\n\n\n\n

Ostatni\u0105 opcj\u0105 jest Align Origins<\/strong>, w kt\u00f3rej punktami odniesienia do wyr\u00f3wnania s\u0105 tzw. origin points<\/em>, czyli \u015brodki obrotu zaznaczonej grafiki, o kt\u00f3rych wi\u0119cej powiemy w nast\u0119pnym odcinku<\/a>. Przybli\u017cymy w nim temat zmiany orientacji element\u00f3w graficznych.<\/p>\n\n\n\n

<\/div>\n\n\n\n
\n
\n
\n

Newsletter Poradnika Automatyka<\/h3><\/div>\n

Czytaj trendy i inspiracje, podstawy automatyki, automatyk\u0119 w praktyce<\/p>\n<\/div>\n

\n
\n