Creating A Landscape Oriented Android Application
An easy tutorial that can help you develop your first Android App!
Landscape vs. Portrait
In mobile applications, there are two types of orientation: landscape and portrait. “Landscape” means that the app is displayed horizontally (hot-dog style), and “Portrait” means the app is displayed vertically (hamburger style). Most applications support both orientations, but there are special use cases where some are landscape or horizontal by default.
After Sketchware’s new update to version 1.3, it’s now capable of creating landscape applications! We’ll talk about how we can implement this little neat feature in Sketchware.
What you’ll need
- Sketchware — a mobile IDE on your smartphone
- Passion for learning! :-)
What you’ll learn
- How to develop your application in Landscape Orientation in Sketchware
Why Landscape?
Some contents are displayed the best when it takes up the whole space. Most applications, such as Entertainment or Games, are run in Landscape Orientation by default. Netflix, one of the most popular media streaming apps, also provide landscape orientation mode for users, so they can enjoy their content full-screen. This feels so natural to us so we really don’t take the time to think about it, but it’s is all part of user experience.
Deciding Landscape vs. Portrait is really up to the developer. Think about different User Experience cases — reading an article on a browser would be more comfortable if viewed in portrait mode, but viewing a video on a browser would be more convenient in landscape mode.
“Why should this app support Landscape mode?”
For Sketchware, we decided to provide landscape mode since it’s more natural for tablet users to develop applications horizontally, and it’s a needed feature in a development tool.
Implementing Landscape Mode in Sketchware
You may have noticed that the View Manager changed after the recent update. There are three new options added in the picture below:
1. Theme — determine if the application is going to contain an actionbar, show in full page, or show default (including both actionbar and statusbar).
2. Screen Orientation — choose from “Portrait” or “Landscape”.
3. Keyboard State — We’ll talk about this in the next article :-)
Screen Orientation determines how our activity is going to be oriented. Each View can have a different orientation — view A may be portrait while view B is landscape. For this View, I’m going to name it “landscape” and change the Screen Orientation to “Landscape.”
Next, you want to make sure your device’s orientation lock is disabled. On my device, the options are either “Portrait” or “Auto-rotate,” but some devices may call them differently. It’s usually found under the status bar menu.
When you rotate your device, Sketchware will also rotate:
I’ve added a TextView saying “I’m in landscape mode!”, and voila! After running the application, I was able to achieve this screen:
A friendly note that if the Activity is set as “Landscape” orientation, this activity will be forced to display in landscape mode even if your device is locked in portrait mode.
If you want to change the MainActivity (the entry point of the application) to Landscape, click on the “View Manager” located in the top right corner, and click on the “main.xml” file to change the orientation.
Conclusion
We’ve learned how you can change the orientation of the application into Landscape mode. In summary, Sketchware’s new 1.3 version allows you to manipulate the orientation of certain activities. Try implementing it when you’re developing your next application on Sketchware!
That’s it. Happy coding! :-)
If you enjoyed this article, please press the 💚 below so others can find this article too!
