Implementing Tabbed Interfaces with ArkUI in HarmonyOS
The ArkUI framework in HarmonyOS provides a versatile Tabs component for creating tabbed user interfaces. This component allows for organized presentation of content, with features such as active state indication, custom tab content, and performance optimization through lazy loading of inactive panels.
Basic Layout
The fundamental structure of ...
Posted on Sun, 11 Oct 2026 16:52:06 +0000 by lynxus
Implementing a Tab Switcher in Vue 2 Using Dynamic Components and v-for
<html lang="en">
<head>
<meta charset="UTF-8" />
<title>Tab Switcher Example</title>
<script src="vue.js"></script>
<style>
.tab-label {
background: #ccc;
padding: 2px 5px;
line-height: 30px;
text-align: center;
cursor: pointe ...
Posted on Sun, 11 Oct 2026 16:03:32 +0000 by deadlyp99
Implementing Tab Navigation in HarmonyOS Applications
Bottom Navigation Bar
@Entry
@Component
struct MainScreen {
build() {
Column() {
Tabs({ barPosition: BarPosition.End }) {
TabContent() {
Text('Home Screen').fontSize(30)
}.tabBar('Home')
TabContent() {
Text('Discovery Screen').fontSize(30)
}.tabBar('Discovery')
TabContent ...
Posted on Tue, 23 Jun 2026 17:09:58 +0000 by rich1983
Implementing Navigation and Tab Layout in HarmonyOS
Router Configuration
Add the router map reference in module.json5:
"routerMap": "$profile:route_map"
Route Map Definition
Create route_map.json in resources/base/profile/:
{
"routerMap": [
{
"name": "LaunchScreen",
"pageSourceFile": "src/main/ets/components/Laun ...
Posted on Sun, 10 May 2026 06:57:57 +0000 by silversinner