chore: update the help manual

assets/deepin-draw/draw/en_US/p_draw.md

@@ -0,0 +1,297 @@
+# Draw|deepin-draw|
+
+## Overview
+
+Draw is a simple drawing tool, supporting rotation, cropping, flipping, and adding texts and shapes among other functions. You can edit local pictures or draw pictures freely.
+
+![1|mian](fig/main.png)
+
+## Guide
+
+You can run, close, and create a desktop shortcut for Draw in the following ways.
+
+### Run Draw
+
+1. Click the Launcher icon ![deepin_launcher](../common/deepin_launcher.svg) in the Dock to enter the Launcher interface.
+2. Locate Draw ![draw](../common/deepin_draw.svg) by scrolling the mouse wheel or searching "draw" in the Launcher interface.
+3. Right-click ![draw](../common/deepin_draw.svg) and the user can:
+ - Click **Send to desktop** to create a desktop shortcut.
+ - Click **Send to dock** to fix the application in the Dock.
+ - Click **Add to startup** to add the application to startup and it will automatically run when the system starts up.
+
+![tips](../common/tips.svg)Tips: In Control Center, you can set Draw as the defaulted picture viewer. Please refer to [Default Applications](dman:///dde#Default Applications) for specific operations.
+
+### Exit Draw
+
+- On the Draw interface, click ![close_icon](../common/close_icon.png) to exit Draw.
+- Right-click ![draw](../common/deepin_draw.svg) in the Dock and select **Close All** to exit Draw.
+- Click ![icon_menu](../common/icon_menu.svg) on the Draw interface and select **Exit** to exit Draw.
+
+### View Shortcuts
+
+On the Draw interface, press **Ctrl** + **Shift** + **?** on the keyboard to view shortcuts. Proficiency in shortcuts will greatly improve your efficiency.
+
+![1|hotkey](fig/hotkey.png)
+
+## Basic Functions
+
+With Draw, you are able to process imported pictures and draw pictures freely. You can also export pictures in multiple formats.
+
+### Create tabs
+
+![1|mian](fig/new.png)
+
+- On the Draw interface, click ![menu](../common/icon_menu.svg)> **New** to create a new tab.
+- You can also click ![add](../common/add.svg) to create a new tab when there are two or more tabs in the window.
+
+### Close tabs
+
+- Click a tab. Then click ![close_icon](../common/close_icon.png) on the tab to close the current tab.
+- Right-click a tab. Select **Close tab** or **Close other tabs**. 
+
+### Open Pictures
+
+1. On the Draw interface, click ![import](../common/Import_normal.png) or ![menu](../common/icon_menu.svg) > **Open**.
+
+2. Select the picture to be imported and click **Open**.
+   If the dimensions of the picture imported exceeds those of the canvas, there will be a pop-up dialog box for you to choose to keep the original size or fit automatically.
+
+   Currently, a maximum of 30 pictures could be imported. Formats including JPG, PNG, TIF, BMP and DDF are supported.
+
+### Export Pictures
+
+1. On the Draw interface, click ![menu](../common/icon_menu.svg)> **Export**.
+
+2. Set the parameters including file name, path, format, picture quality and dimensions， among which the dimentions can be set  by percentage or pixels.
+
+   - By percentage (defaulted): You can custom the percentage and scale up or down the image equally by percentage.
+
+   - By pixels: You can custom the pixels of the image height and width and scaled it up or down according to the absolute pixels of the custom height and width. If **Lock aspect ratio** is checked, either of the value will be changed accordingly with the other one.
+
+3. Click **Save**. 
+
+![1|main](fig/export.png)
+
+### Save Pictures
+
+1. On the Draw interface, click ![menu](../common/icon_menu.svg)> **Save** or ![menu](../common/icon_menu.svg)> **Save as**.
+2. Set the file name and format to be saved.
+3. Click **Save**.
+
+> ![notes](../common/notes.svg) Notes: The suffix of the file name can be omitted and it can be added automatically in the process of saving the file. 
+
+### Print Pictures
+
+1. On the Draw interface, click ![menu](../common/icon_menu.svg)> **Print**.
+2. Select the printer and set the printing parameters.
+3. Click **Print**.
+
+> ![notes](../common/notes.svg) Notes: Click **Advanced** to customize the printing parameters.
+
+## Drawing Tools
+
+With the drawing tools of Draw, you can give full play to your imagination and creativity for free graphic drawings. 
+
+### Shape Tool
+
+1. On the Draw interface, click  ![rectangle](../common/rectangle_normal.png), ![oval](../common/oval_normal.svg) ,![triangle](../common/triangle_tool_normal.svg),![star](../common/drawstar.svg) or ![hexagon](../common/hexagon_tool_normal.svg).
+2. You can set the parameters for graphics in the attributes column as follows:
+   - Click **Fill** to set the fill color and transparency for graphics.
+   - Click **Stroke** to set the stroke color and transparency for graphics pen.
+   - Choose and set the weight of Stroke from the drop-down list right to the **Stroke** button.
+   - Click **Points** (from 3 to 50) and **Radius** (from 0% to 100%) to set the points and radius for star graphics only.
+   - Click **Sides** (from 4 to 10) to set sides for polygon graphics only. 
+
+   > ![tips](../common/tips.svg)Tips: The number of sides, points and radius can be adjusted by clicking ![Up](../common/up.svg) or ![down](../common/down.svg) in the attributes column, scrolling the mouse wheel or pressing ![Up](../common/Up.svg) or ![Down](../common/Down.svg)on the keyboard after selecting the value of sides, points or radius.
+3. Drag the mouse to draw graphics in the canvas area. 
+
+>![tips](../common/tips.svg) Tips: Facilitated by **Shift** or **Shift + Alt** on the keyboard, you can draw a square, circle, equilateral triangle, regular pentagram, and regular pentagon when drawing graphics with ![rectangle](../common/rectangle_normal.png), ![oval](../common/oval_normal.svg), ![triangle](../common/triangle_tool_normal.svg), ![star](../common/drawstar.svg) and ![hexagon](../common/hexagon_tool_normal.svg).
+
+![1|shape](fig/shape1.png)
+
+![1|shape](fig/shape2.png)
+
+![1|shape](fig/shape3.png)
+
+### Line Tool
+
+1. On the Draw interface, click ![line](../common/line_normal.svg).
+
+2. You can set parameters for your lines in the attributes column as follows:
+   - Click **Stroke** to set the color and transparency of the line.
+   - Select the weight of line from the drop-down list. 
+   - Click **Start** and **End** to choose the style of starting point and ending point of lines.
+
+3. Drag the mouse in the canvas area to draw lines.
+
+![1|pencil](fig/line.png)
+
+### Text Tool
+
+1. On the Draw interface, click ![text](../common/text_normal.svg).
+
+2. You can set text styles in the attributes column as follows:
+   - Click **Color** to set the fill color and transparency of texts.
+   - Select the font style in the **Font** drop-down list.
+   - Select regular font or bold font in the drop-down list.
+   - Adjust the **Size** by entering a value manually or selecting a size in the drop-down list.
+
+3. Click in the canvas area to enter texts in the text box.
+
+>![tips](../common/tips.svg)Tips: You can use shortcuts to adjust the font size. When font is under editing,  click the font size right to the **Size** icon and click the ![up](../common/Up.svg) or ![up](../common/Down.svg) key on the keyboard to adjust the font size.
+
+![1|text](fig/text.png)
+
+### Pencil Tool
+
+1. On the Draw interface, click ![text](../common/pencil_normal.svg).
+2. You can set parameters for your pencil in the attributes column as follows:
+   - Click **Stroke** to set the color and transparency of the pencil.
+   - Select the pencil needed from the drop-down list. 
+   - Select the weight of the pencil from the drop-down list. 
+3. Drag the mouse on the canvas area to draw graphics.
+4. Click the ![icon](../common/choose_tools.svg) icon to select and edit the graphic.
+
+![1|pencil](fig/pencil.png)
+
+### Eraser Tool
+
+1. On the Draw interface, import a picture or draw a graphic with the pencil.
+2. Click the ![icon](../common/eraser.svg) icon and set the width for the eraser in the attributes column.
+3. Hold on and drag the left key of the mouse to erase the part of the picture or graphic  as needed. 
+
+![1|eraser](fig/eraser.png)
+
+### Blur Tool
+
+1. On the Draw interface, import a picture and click ![blur](../common/blur_normal.svg).
+2. Select the blur **Type**.
+3. Change the blur area width by clicking the up or down arrow in **Width**.
+4. Drag the mouse in the canvas area to blur the area as needed.
+
+> ![Notes](../common/notes.svg) Notes: The blur tool is only applicable for pictures.
+
+![1|blur](fig/blur.png)
+
+![1|mosaic](fig/mosaic.png)
+
+## Edit Functions
+
+You can copy, crop, and rotate graphics with the editing functions, and also adjust layers and texts.
+
+### Select
+
+After drawing entities with the graphics drawing tool, you can perform the following operations:
+
+- Select drawn graphics or texts.
+- Perform marquee selection and all graphics within the marquee selection area are put under selected status.
+- Drag to adjust the size of the graphic within the selected area.
+- Hold down the **Shift** key and click to select multiple graphics.
+
+> ![notes](../common/notes.svg) Notes: Click the blank area in Draw to cancel the graphics selected.
+
+
+### Crop
+
+1. On the Draw interface, click ![cut](../common/cut_normal.svg) to enter the cropping mode.
+2.  Select a cropping mode in the attributes column.
+  - Free: enter the dimension manually or adjust the area to be cropped by dragging the cropping border to customize the canvas cropping.
+  - Original: crop in proportion to the original picture by a ratio of 1:1, 2:3, 8:5 and 16:9 respectively.
+
+3. Press the **Enter** key or the ![check](../common/check.svg)icon in the attributes column to crop the canvas.
+
+![1|cut](fig/cut.png)
+
+### Flip
+
+1. On the Draw interface, select an imported picture.
+2. Click ![flip](../common/filp_Vertical_normal.png) or ![flip](../common/flip_Horizontal_normal.png) to flip the picture vertically or horizontally.
+
+### Rotate
+
+1. On the Draw interface, select an imported picture.
+2. Click ![rotate](../common/rotate_right_normal.png) or ![rotate](../common/rotate_left_normal.png) to rotate the picture for 90 degrees clockwise or counterclockwise. Or rotate the picture by rotating the ![icon](../common/icon_rotate.svg) icon on the picture.
+
+
+![1|roll_over](fig/rotate.png)
+
+### Auto Fit
+
+1. On the Draw interface, select an imported picture.
+
+2. Click ![auto fit](../common/auto_fit.svg) to adjust canvas size based on the picture.
+    - If you choose one picture, the canvas size is adjusted according to the width and height of that picture.
+    - If you choose multiple pictures at a time, the canvas size is adjusted according to the biggest range of edges.
+
+### Group/Ungroup
+
+1. Select multiple graphics on the Draw interface.
+2. Right-click to select **Group** or click the ![icon](../common/layer_group.svg) in the attributes column to group the graphics.
+3. Right-click the graphics grouped and select **Ungroup** or click the ![icon](../common/layer_ungroup.svg) in the attributes column to ungroup the graphics.
+
+> ![tips](../common/tips.svg) Tips: You can also press  **Ctrl+G** and  **Ctrl+Shift+G** to group and ungroup graphics respectively. 
+
+### Adjust Layers
+
+1. On the Draw interface, select an imported picture.
+2. Right-click **Layer** and select **Raise Layer**, **Lower Layer**, **Layer to Top** or **Layer to Bottom** to adjust the layer order.
+
+![1|layer](fig/layer.png)
+
+### Align Layers
+
+1. On the Draw interface, select one or several graphics.
+2. Right-click and select **Align**. Choose from **Align left**, **Horizontal centers**, **Align right**, **Align top**, **Vertical centers**, **Align bottom**, **Flip horizontally**, and **Distribute vertical space**. 
+
+>![notes](../common/notes.svg) Notes: 
+>- When you select one graphic, the layer will be aligned with the canvas.
+>- When you select three or more graphics, **Flip horizontally** and **Distribute vertical space** are available to be selected.
+
+![1|align1](fig/align1.png)
+
+### Align Texts
+
+1. On the Draw interface, click ![text](../common/text_normal.svg) and adjust the size of the text box.
+2. Select target text. Right-click and select **Text Align Left**, **Text Align Right** or **Text Align Center** to align texts.
+
+![1|layer](fig/align.png)
+### Copy and Paste
+
+1. On the Draw interface, select the graphics to be copied.
+2. Right-click and select **Copy** or use the shortcuts **Ctrl + C** to copy the graphics to the clipboard.
+3. Right-click and select **Paste** or use the shortcuts **Ctrl + V** to paste the graphics to Draw.
+
+![1|copy](fig/copy.png)
+
+### Delete
+
+1. On the Draw interface, select a graphic or picture.
+2. Right-click and select **Delete** or use the **Delete** key on the keyboard to delete the selected graphic or picture.
+
+![1|delete](fig/delete.png)
+
+## Main Menu
+
+In the main menu, you can create a new tab, [Open Pictures](#Open Pictures), [Export Pictures](#Export Pictures), [Save Pictures](#Save Pictures), [Print Pictures](#Print Pictures), switch window themes, view help manual, and get more information about Draw.
+
+### Theme
+
+There are three window themes, namely Light Theme, Dark Theme, and System Theme.
+
+1. On the Draw interface, click ![icon_menu](../common/icon_menu.svg).
+2. Click **Theme** to select one theme.
+
+### Help
+
+1. On the Draw interface, click ![icon_menu](../common/icon_menu.svg).
+2. Click **Help** to view the manual of Draw.
+
+### About
+
+1. On the Draw interface, click ![icon_menu](../common/icon_menu.svg).
+2. Click **About** to view the version and introduction of Draw.
+
+### Exit
+
+1. On the Draw interface, click ![icon_menu](../common/icon_menu.svg).
+2. Click **Exit** to exit Draw.