Graphical Interface Scaling in InduSoft Web Studio
Download as pptx, pdf0 likes2,089 views
Graphical interface scaling or Screen Scaling in InduSoft Web Studio is a set of capabilities that allow you to alter the aspect ratio and size of your screens dynamically. In this webinar, we will discuss why it can sometimes be very important to scale your screen, go over aspect ratios, and discuss screen and project resolutions. Once we’ve covered the basics of screen scaling, we will go over various ways of implementing these capabilities in InduSoft Web Studio, and even how you can extend your application to multiple screens.
More Related Content
What's hot (19)
Similar to Graphical Interface Scaling in InduSoft Web Studio (20)
More from AVEVA (20)
Recently uploaded (20)
Graphical Interface Scaling in InduSoft Web Studio
- 1. Graphical Interface Scaling Webinar November 29, 2017
- 2. www.InduSoft.com | [email protected] Agenda • Reasons to scale your screen • Understanding Aspect Ratio • Project Resolution vs. Screen Resolution • Auto Screen Scaling check box • Convert Resolution • Manual Change of Screen Attributes • Open() optional parameters • Span Multiple screens, SetViewerPos() • VK scaling
- 3. www.InduSoft.com | [email protected] Please Vote! Please Cast Your Vote Here!
- 4. www.InduSoft.com | [email protected] Reasons to scale • Machine builders can offer “Standard”, “Low- end”, and “High-end” offerings • Obsolete or failing hardware • Large production monitoring or Andon • Video Wall (matrix) • Mobile view (example, tablets, phones)
- 5. www.InduSoft.com | [email protected] Understanding Aspect Ratio • Common Aspect Ratios • 4:3 (1.33:1) • 320x240 • 640x480 • 800x600 • 1024x768 • 16:9 (1.78:1) • 1600x900 • 1920x1080 (1080p) • 2560x1440 • 3840x2160 (4K) • Others See “Resources” 4:3 16:9 640/480 = 1.33 4/3 =1.33 1920/1080 = 1.78 16/9 = 1.78
- 6. www.InduSoft.com | [email protected] Display Resolutions Source: https://en.wikipedia.org/wiki/File:Vector_Video_Standards4.svg
- 7. www.InduSoft.com | [email protected] Resources Best resolution to choose http://www.indusoft.com/blog/2011/03/28/what-is-the-best-resolution-for-a-project- in-indusoft-web-studio/ 1. Native, if you know it 2. Aspect ratio, if you know it 3. Popular https://www.w3counter.com/globalstats.php Aspect Ratio blog post http://www.indusoft.com/blog/2013/10/01/aspect-ratios-and-your-indusoft-web- studio-project/ Multi Monitor Sample http://www.indusoft.com/Products- Downloads/SampleApplications?EntryId=1070&Command=Core_Download http://www.indusoft.com/Documentation/Technical- Notes?EntryId=955&Command=Core_Download
- 8. www.InduSoft.com | [email protected] Project Resolution vs. Screen Resolution Project Resolution Screen Resolution Can’t change in GUI
- 9. www.InduSoft.com | [email protected] Proj vs. Screen vs Container 5 x 5 Project Resolution 5 x 5 Screen Resolution 5 x 5 Container Resolution
- 10. www.InduSoft.com | [email protected] Auto Screen Scaling • Enlarges (or shrinks) keeping aspect ratio until it fits the container (bottom or right side) • Project – Viewer (Local Viewer and Secure Viewer) • Thin Clients different check box • Web Settings (Web Thin Client) • Graphics – Thin Clients - Mobile Access – Global Settings (SMA)
- 11. www.InduSoft.com | [email protected] Proj vs. Screen vs Container 5 x 5 Project Resolution 5 x 5 Screen Resolution 10 x 10 Container Resolution Auto Screen Scale OFF 5 x 5
- 12. www.InduSoft.com | [email protected] Proj vs. Screen vs Container 5 x 5 Project Resolution 5 x 5 Screen Resolution 10 x 10 Container Resolution Auto Screen Scale ON Project Resolution is only used with Auto Screen Scaling
- 13. www.InduSoft.com | [email protected] Convert Resolution • Suggested use, when you want to change the aspect ratio • May need additional clean up • Check Box, Keep original aspect ratio for each object • Resize objects, keep aspect ratio, changes spacing
- 14. www.InduSoft.com | [email protected] Manual Change of Screen Attributes • Change the screen dimensions • Use to make screen groups • Alter an individual screen for use on a particular device • Size/position screen to fill area left by Auto Screen Scale
- 15. www.InduSoft.com | [email protected] If changing Aspect Ratio 1. Make backup of project 2. Change resolution of monitor (depends on graphics card) 3. Use Auto Screen Scale. Fill in “bar” with optional screen/objects 4. Convert Resolution 5. Redevelop screens. Can copy and paste
- 16. www.InduSoft.com | [email protected] Open() optional parameters • The Open() Function supports optional screen coordinates, could be different than original size • Open(strScreenAndProperties,optNumX1,optNumY1,op tNumX2,optNumY2,optNumResizeFlag,optNumID,optSt rMnemonicList) • Useful for popup and dialog
- 17. www.InduSoft.com | [email protected] Span Multiple Screens • SetViewerPos() • SetViewerPos(numLeft,numTop,optNumWidth,optNumHeight) • Don’t execute in Startup Script • Use Graphics Script, OnStart() 1920x1080 1920x1080 • Start another Viewer • WinExec() in Background Script • View.exe in Graphic Script “Sub Graphics_OnStart()” • SetViewerPos 0, 0 W = 3840 H = 1920
- 18. www.InduSoft.com | [email protected] Pop up keyboard scaling
- 20. www.InduSoft.com | [email protected] Email (US) [email protected] (Brazil) [email protected] (Germany) [email protected] Support [email protected] Web site (English) www.indusoft.com (Portuguese) www.indusoft.com.br (German) www.indusoft.com.de Phone +1 (512) 349-0334 (US) +55 (11) 3293-9139 (Brazil) +49 (0) 6227-732510 (Germany) Toll-Free 877-INDUSOFT (877-463-8763) Fax +1 (512) 349-0375 Contact InduSoft Today Germany USA Brazil