![2018 project canvas ybhs 2018 project canvas ybhs](http://www.bedenk.be/upload/attach-image/project-canvas-nl-square-link-1.jpg)
![2018 project canvas ybhs 2018 project canvas ybhs](https://i.pinimg.com/originals/66/9f/95/669f9553a0c717e9eb49e888fc3998d8.jpg)
Upload a picture to Media as the applications asset which will be packaged with the application as in figure 9.įigure 9 Upload a picture to display Blocks Overview Figure 10 Define the global parameters and prepare the initialization of the screen when app first runs Global Parameters Sizing set to Responsive as in figure 8.įigure 8 Sizing properties of Screen Component.On Screen1, change the default settings of the following properties. PictureCanvas: A Canvas displays the picture.X_Controller: horizontal arrangement inside the horizontal container as width controller.HorizontallArrangement1: horizontal arrangement inside the working area as a container.Y_Controller: vertical arrangement inside the working area as height controller.WorkArea: vertical arrangement as working area.In the Designer, add the following components into the Viewer. When the user clicks on the Help button in figure 2, a notification shows the instructions.įigure 6 Show instructions Design Overview Figure 7 shows the outline of the Components used in the project The user can drag anywhere on the screen to view different parts of the picture as figure 4 and 5.įigure 4 Dragged to the top left corner Figure 5 Dragged to the bottom right corner The picture will display only the center part of the picture as in figure 3.įigure 3 Display the picture 2 times larger When the user clicks on the Zoom In button, the picture will be enlarged 2 times its original size in both width and height. When the user touches the screen, a popup notification will be shown, and users have options by clicking the appropriate buttons as in figure 2. When the application runs, the screen is initialized, and a picture is displayed on the screen as in figure 1. I created a simplified and modified application based on the downloaded project and explain it here. I tried the downloaded project, and would like to share the mechanism behind it with others here. The post provides a project aia file for download. The article also included a hyperlink to a forum post with an example which demonstrated that a Canvas could be dragged.
![2018 project canvas ybhs 2018 project canvas ybhs](https://thecanvasrevolution.com/wp-content/uploads/2020/07/Agile-Project-Canvas.png)
The page suggested some important rules and common approaches to responsive design. One day, when I put the keywords Responsive design in App Inventor in a web search, Google returned a page from MIT, other App Inventor Features references. This is a guest blog by MIT Master Trainer Emile Wong