なんちゃって タブスイッチ
新人プログラマ応援 - みんなで新人を育てよう!
新人向けに、VTでタブ切替を作る最小構成をまとめました。
初めに
VT にタブスイッチ無かったので、
「ほな作るか」で昼飯前にサッと組んだやつです。
画面だけ切り替わればええねん、という時用。
VT シミュレーションと KV(空コード)だけで動きます。
新人さんの “最初の画面構成” にもちょうどいい小ネタです。
画像(全体画面)
1. 使うデバイス(最小構成)
2. 画面構成の考え方(シンプル版)
今回の“なんちゃってタブ”は、
画面を3レイヤーに分ける とめちゃ楽になります。
[1] 画面共通部分(グローバルウィンドウ)
[2] タブ部分(グローバルウィンドウ)
[3] 各ページの中身(通常画面)
3. 画面共通部分を1枚作る
まず、
全ページで共通になる部分を1枚だけ作る。
• 共通ステータス
• タブを置くスペース(画面呼出)
この画面は グローバルウィンドウ にしておく。
4. タブ部分も1枚だけ作る(これもグローバル)
タブのボタンだけをまとめた画面を作る。
• タブ1 → DM302 = 0
• タブ2 → DM302 = 1
• タブ3 → DM302 = 2
• 押されたら R12200 を SET
これも グローバルウィンドウ にしておく。
(別ウィンドウにしておくと、修正がらくちん!)
■ グループ化してるので、バラシて解析してね。
5. 通常画面は「貼り付けるだけ」
各ページ(Page1 / Page2 / Page3)は、
中身だけ書けばOK。
共通部分は全部 “画面呼出” で済む。
[Page1]
├ 画面共通部分(呼び出し)
└ Page1 の内容を書く
[Page2]
├ 画面共通部分(呼び出し)
└ Page2 の内容を書く
6. 画面番号は DM302 + オフセット
DM302 は 0 始まり。
画面番号が連続している前提で、
オフセットを足すだけで切り替えが成立。
画面番号 = DM302 + 100
[DM302] [オフセット] [実画面番号]
0 + 100 → 100
1 + 100 → 101
2 + 100 → 102
7. 例:Recipe設定画面
今回の例では、
タブ切り替えで Recipe設定 のページを切り替える構成。
• Page1 → 基本設定
• Page2 → 詳細設定
• Page3 → 確認画面
中身だけ書き換えればタブUIが完成。
まとめ
• 画像は全体画面1枚でOK
• 共通部分とタブ部分はグローバルウィンドウ
• 各ページは中身だけ書く
• 画面番号は DM302 + オフセット
• R12200 は通知 → PLCで後片付け
• DM322.xx は VT内で完結
• VTシミュレーション+KV空コードで即動く
• 昼飯前に作れるくらい軽いタブ切り替え
この記事の内容をそのまま試せる
VT画面プロジェクト(画面のみ) を用意しました。
サンプルZIPはこちら
https://yenqoo.com/qiita/nanchatte_tab.zip
この記事が、必要な人へ。
困っている人に、届きますように。
▼ 関連記事(なんちゃってシリーズ)
• なんちゃって四捨五入(KV編)
https://qiita.com/yenqoo/items/41af6dd6a2f3ab4240e2
▼ 人気記事
• キーエンスPLCで信号灯を“グラデーション点滅”させる方法
https://qiita.com/yenqoo/items/9a2509b26e415a87a39c
作者
圓空(えんくう)
https://yenqoo.com/spices/
https://yenqoo.com/monologue/
キーエンスPLCを中心に、
“技術 × 美学 × 遊び心” をテーマにした技術文化を発信しています。

