Differences

This shows you the differences between two versions of the page.

--- en:sw:01-mervis:hmi-image-hidden [2021/08/02 12:51]
avsetula created
+++ en:sw:01-mervis:hmi-image-hidden [2021/08/03 05:21] (current)
lpolcerova
@@ Line 1: / Line 1: @@
 ====== Image ======
 <WRAP group>
 <WRAP half column 81%>
 Create a new project or integrate into an already existing one.
 </WRAP>
 <WRAP half column 15%>
@@ Line 16: / Line 17: @@
 <WRAP center round box>
-<html><span class="kbBlue-H4alt">Pro účely tohoto návodu je třeba:</span></html>
+<html><span class="kbBlue-H4alt">For the purpose of this tutorial:</span></html>
-  - [[cs:sw:01-mervis:creating-new-project-hidden|vytvořit projekt a přiřadit PLC]]
+  - [[en:sw:01-mervis:creating-new-project-hidden|create a project and attach a PLC]]
-  - [[cs:sw:01-mervis:creating-simple-hmi-hidden|vytvořit grafickou HMI šablonu a přiřadit ji k PLC]]
+  - [[en:sw:01-mervis:creating-simple-hmi-hidden|create a graphical HMI template and assign it to the PLC]]
-  - nastavit [[cs:sw:01-mervis:creating-simple-hmi-hidden#zabezpeceni_hmi|zabezpečení HMI]]
 </WRAP>
@@ Line 27: / Line 27: @@
 \\
-<html><span class="kbBlueText">Pokud máte vše uvedené připraveno, pokračujte dle následujícího návodu:</span></html>
+<html><span class="kbBlueText">If you have everything listed ready, follow the instructions below:</span></html>
 ----
-Složka <html><span class="avBlueText">Zdroje</span></html> slouží pro vkládání zdrojových dat, např. stylů HMI objektů, nebo právě obrázků.
+The <html><span class="avBlueText">Resources</span></html> folder is used for storing source data, such as styles of HMI objects, or just images.
 <html><figure ondblclick="redirectImg(this)" class="zoom" onclick="zoom(event)" style="background-image: url(https://kb.unipi.technology/_media/en:sw:01-mervis:02_hmi-image_en.png)">
@@ Line 37: / Line 38: @@
 </figure></html>
-Vždy doporučujeme řadit zdrojová data podle obsahu do samostatných adresářů. Pro vytvoření nového adresáře klikněte pravým tlačítkem myši na složku <html><span class="avBlueText">Zdroje</span></html> a v kontextovém menu vyberte <html><span class="avBlueText">Přidat > Přidat adresář</span></html>.
+We always recommend sorting the source data by content into separate directories. To create a new directory, right-click on the <html><span class="avBlueText">Resources</span></html> folder in the left panel and select <html><span class="avBlueText">Add > Add Directory</span></html> from context menu.
 <html><figure ondblclick="redirectImg(this)" class="zoom" onclick="zoom(event)" style="background-image: url(https://kb.unipi.technology/_media/en:sw:01-mervis:03_hmi-image_en.png)">
@@ Line 43: / Line 44: @@
 </figure></html>
-Vložte název nového adresáře (v případě návodu je použit název <html><span class="avOrangeText">Moje obrázky</span></html>) a klikněte na <html><span class="avBlueText">OK</span></html> pro potvrzení.
+Enter the name of the new directory (in the case of the manual, the name <html><span class="avOrangeText">My images</span></html> is used) and click <html><span class="avBlueText">OK</span></html> to confirm.
 {{ :en:sw:01-mervis:04_hmi-image_en.png?nolink |}}
-Pomocí šipky vpravo od složky <html><span class="avBlueText">Zdroje</span></html> rozbalte její obsah, kde je také nově vytvořená složka se zvoleným názvem. Nyní na ni klikněte pravým tlačítkem myši a v kontextovém menu vyberte <html><span class="avBlueText">Přidat > Přidat obrázek</span></html>.
+Use the arrow to the left of the <html><span class="avBlueText">Resources</span></html> folder to expand its contexts, which also contains the newly created folder with the chosen name. Now right-click on it and select <html><span class="avBlueText">Add > Add Image</span></html> from context menu.
 <html><figure ondblclick="redirectImg(this)" class="zoom" onclick="zoom(event)" style="background-image: url(https://kb.unipi.technology/_media/en:sw:01-mervis:05_hmi-image_en.png)">
@@ Line 53: / Line 54: @@
 </figure></html>
-Na následujícím snímku jsou již vidět vložené obrázky ve vlastním adresáři, které lze dále použít v HMI šabloně.
+The following image shows the embedded images in your own directory, which can be used in the HMI template.
 <html><figure ondblclick="redirectImg(this)" class="zoom" onclick="zoom(event)" style="background-image: url(https://kb.unipi.technology/_media/en:sw:01-mervis:06_hmi-image_en.png)">
@@ Line 59: / Line 60: @@
 </figure></html>
-Dvojklikem otevřete HMI šablonu a pro vložení obrázku do šablony klikněte ve spodní části levého panelu na <html><span class="avBlueText">HMI objekty</span></html>, tím zobrazíte nabídku s prvky pro Mervis HMI.
+Double-click to open the HMI template and to insert the image into the template, click on the <html><span class="avBlueText">HMI Gadget Explorer</span></html> at the bottom of the sidebar to display the menu with elements (gadgets) for Mervis HMI.
 <html><figure ondblclick="redirectImg(this)" class="zoom" onclick="zoom(event)" style="background-image: url(https://kb.unipi.technology/_media/en:sw:01-mervis:07_hmi-image_en.png)">
@@ Line 65: / Line 66: @@
 </figure></html>
-Zde za pomoci myši přetáhněte prvek <html><span class="avBlueText">Image</span></html> na HMI šablonu otevřenou v pracovním prostoru.
+Here, use the mouse to drag the <html><span class="avBlueText">Image</span></html> element onto the HMI template open in the workspace.
 <html><figure ondblclick="redirectImg(this)" class="zoom" onclick="zoom(event)" style="background-image: url(https://kb.unipi.technology/_media/en:sw:01-mervis:08_hmi-image_en.png)">
@@ Line 71: / Line 72: @@
 </figure></html>
-Klikem, nebo tahem označte vložený prvek. V pravém sloupci jeho vlastností nyní klikněte na <html><span class="avBlueText">Zdroj obrázku</span></html> a následně otevřete nabídku pomocí tlačítka {{:files:dialog-open_button.png?nolink|}}.
+Click or drag mouse to select the inserted element. Now, click on <html><span class="avBlueText">Image Source</span></html> in the right column of its properties and then open the menu with the button {{:files:dialog-open_button.png?nolink|}}.
 <html><figure ondblclick="redirectImg(this)" class="zoom" onclick="zoom(event)" style="background-image: url(https://kb.unipi.technology/_media/en:sw:01-mervis:09_hmi-image_en.png)">
@@ Line 77: / Line 78: @@
 </figure></html>
-Otevře se dialogové okno pro výběr obrázku, zde vyberte žádaný obrázek a klikněte na <html><span class="avBlueText">OK</span></html> pro potvrzení.
+The image selection dialog box opens, select the desired image here and click <html><span class="avBlueText">OK</span></html> to confirm.
 {{ :en:sw:01-mervis:10_hmi-image_en.png?nolink |}}
-Po vložení lze měnit <html><span class="avOrangeText">pozici, rozměry, roztažnost, otočení</span></html> a <html><span class="avOrangeText">zrcadlení</span></html> obrázku. Výsledek může vypadat např. jako na následujícím snímku:
+Once inserted, you can change the <html><span class="avOrangeText">positon, sizes, stretch, rotation</span></html> and <html><span class="avOrangeText">mirroring</span></html> of the image. The result may look like the following image:
 <html><figure ondblclick="redirectImg(this)" class="zoom" onclick="zoom(event)" style="background-image: url(https://kb.unipi.technology/_media/en:sw:01-mervis:11_hmi-image_en.png)">
 <img src="https://kb.unipi.technology/_media/en:sw:01-mervis:11_hmi-image_en.png" />
 </figure></html>