渡久市役所

駅ナンバリング対応のE235系データを収録
"NextStation v0.2.1.0" 公開中!

テーマの概要 - NextStation リファレンス

NextStationでの表示装置の外観はテーマとして定義されており、路線・車両ごとに異なる画面を再現することができます。テーマファイルは他の設定ファイルと異なり、Extensible Application Markup Language(XAML)を用いて記述します。NextStationのGUIは、Windows Presentation Foundation(WPF)で作られているので、XAMLではWPF向けの機能や標準コントロールを利用することができます。また、表示装置再現の目的に特化したNextStation用のコントロール等も用意されており、これらも使用することができます。

NextStationでは、各駅の名称やプラットホーム、乗り換え路線のほか、列車の状態、行き先、種別、現在時刻等のデータが用意され、経過に伴って内容が変わりますが、テーマファイルでは、データバインディングという仕組みを使って画面上のGUI要素とこれらのデータを結合します。内容の変化はリアルタイムで画面上に反映されるようになっています。

XAMLおよびWPFについての詳細は、Microsoft Developer Network(MSDN)に記載されているのでそちらを参照してください。標準のコントロールやその他機能についても解説があるので、不明な点は検索すれば情報が出てくるはずです。

テーマファイルの構造

テーマファイルの実体は、表示装置ウィンドウのGUI要素の構造と見た目を規定するスタイルやテンプレート、色を指定するブラシなどのリソースの集合であるリソースディクショナリです。ResourceDictionary要素をルートとし、その中にリソースを定義します。各リソースには x:Key属性が付けられており、この値をキーとして参照するリソースを指定します。また、Style要素やControlTemplate要素にはTargetType属性があり、スタイルやテンプレートを適用するコントロールの型を指定します。x:Key属性がないStyle要素によるスタイルは、TargetType属性で指定されたすべてのコントロールに適用されます。

NextStationでは、表示装置ウィンドウにNextStationViewコントロールが配置されており、このコントロールに対するスタイルを定義することで表示装置をデザインします。駅名や時刻などを表示する個別の部品についてもスタイルやテンプレートで定義し、適用するコントロールから参照します。

個々のGUI要素で表示するデータは、データバインディングによって参照します。特定の値や状態になった時に表示や動作を変える際には、トリガーを利用することができます。

以下に、NextStation v0.2.0.0 付属の埼京線E233-7000用テーマファイルの一部を掲載します。

<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
                    xmlns:PresentationOptions="http://schemas.microsoft.com/winfx/2006/xaml/presentation/options"
                    xmlns:ctrl="clr-namespace:WatakuCity.NextStation.Controls;assembly=NextStation"
                    xmlns:cvt="clr-namespace:WatakuCity.NextStation.Converter;assembly=NextStation">
    <x:Array x:Key="SolidLineColorBrushes" Type="SolidColorBrush">
        <!-- 埼京線 -->
        <SolidColorBrush Color="#FF009B8B" PresentationOptions:Freeze="True"/>

        <!-- りんかい線 -->
        <SolidColorBrush Color="#FF002E80" PresentationOptions:Freeze="True"/>
    </x:Array>

    ...

    <Style x:Key="MainArea" TargetType="Control">
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="Control">
                    <Border Name="MainAreaBase" BorderThickness="0,15,0,5">
                        <Border.Background>
                            ...
                        </Border.Background>
                        <Border.BorderBrush>
                            ...
                        </Border.BorderBrush>
                        <Grid>
                            <Control Style="{StaticResource TrainType}" Margin="8,1" HorizontalAlignment="Left" VerticalAlignment="Top"/>
                            <Control Style="{StaticResource Destination}" Margin="220,6,0,0" HorizontalAlignment="Left" VerticalAlignment="Top"/>
                            <Control Name="StationName" Style="{StaticResource StationName}" Margin="8,0,0,0" HorizontalAlignment="Left" VerticalAlignment="Bottom"/>
                            <Control Style="{StaticResource CarNumber}" Margin="0,1,8,0" HorizontalAlignment="Right" VerticalAlignment="Top"/>
                            <Control Style="{StaticResource CurrentTime}" Margin="0,0,10,0" HorizontalAlignment="Right" VerticalAlignment="Bottom"/>
                        </Grid>
                    </Border>
                    <ControlTemplate.Triggers>
                        <MultiDataTrigger>
                            <MultiDataTrigger.Conditions>
                                <Condition Binding="{Binding TrainInfo.TrainState}" Value="Stopping"/>
                                <Condition Binding="{Binding StationInfo.IsOrigin}" Value="True"/>
                            </MultiDataTrigger.Conditions>
                            <Setter TargetName="MainAreaBase" Property="Background" Value="#FF000000"/>
                            <Setter TargetName="MainAreaBase" Property="BorderThickness" Value="0,15,0,0"/>
                            <Setter TargetName="MainAreaBase" Property="Padding" Value="0,0,0,5"/>
                            <Setter TargetName="StationName" Property="Style" Value="{StaticResource StationNameAtOrigin}"/>
                        </MultiDataTrigger>
                    </ControlTemplate.Triggers>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>

    <Style x:Key="OptionalArea" TargetType="Control">
        ...
    </Style>

    <Style TargetType="ctrl:NextStationView">
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="ctrl:NextStationView">
                    <StackPanel Width="960" Height="540" Background="#FFFFFFFF">
                        <Control Name="MainArea" Style="{StaticResource MainArea}" Height="170"/>
                        <Control Name="OptionalArea" Style="{StaticResource OptionalArea}" Height="370"/>
                    </StackPanel>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>
</ResourceDictionary>

テーマで使用できるプロパティ

NextStationでは、表示装置ウィンドウ用に以下のプロパティが公開されており、データバインディングによって参照することができます。これらのプロパティの下にはより細かいプロパティが存在し、階層構造になっています。例として、TrainInfoプロパティの下にはDirection、TrainState、TrainType、TrainName、ServiceInfo、Destinationといったプロパティがあります。

プロパティ名 概要
TrainInfo 現在の列車の状態、種別、行き先等
StationInfo 次の停車駅の駅名、プラットホーム、乗り換え路線等
MainArea 基本情報表示部の表示言語等
OptionalArea 補助情報表示部の表示モード、言語等
DetailedRouteMap 詳細路線図で用いる各駅のリスト
RouteMaps 広域路線図で用いる各駅のリスト 複数ページに対応
Train プラットホーム情報で用いる列車の編成情報
Time 現在時刻
CarNumber 表示装置の設置号車
Side 表示装置の設置位置
ThisSideWillOpen 表示装置設置側のドアが開くかどうかのブール値

コントロール

NextStationでは、WPFの標準コントロールが使用できるほか、WatakuCity.NextStation.Controls 名前空間に定義された以下のコントロールを使用できます。テーマファイル内で使用する際は、ルート要素で名前空間を指定して参照できるようにしてください。上記サンプルコードでは ctrl:プレフィックスで参照しています。

コントロール名 概要
NextStationView 表示装置のルート要素となるコントロール 他のGUI要素は内部にスタイルとして配置されます
VerticalTextControl 縦書き/横書き両対応のテキストコントロール 縁取り線描画、文字間の幅設定も可能
VerticalTextMultiLine 複数のVerticalTextControlを内部に持たせて複数行にするためのコントロール
OutlineTextControl 縁取り線のあるテキストを表示するコントロール
TransferDisplayGrid 乗り換え路線情報をグリッド表示するためのコントロール
TransferInfoPresenter 個別の乗り換え路線の表示用コントロール
LineIcon 路線アイコン表示用のコントロール

コンバータ

バインディングするプロパティの値をテーマファイルで使用しやすい形式に変換するために、WatakuCity.NextStation.Converter 名前空間に定義された以下のコンバータを使用できます。テーマファイル内で使用する際は、ルート要素で名前空間を指定して参照できるようにしてください。上記サンプルコードでは cvt:プレフィックスで参照しています。

コンバータ名 概要
BrushSelector リソースとして定義されたブラシの配列からインデックスを使用して目的のブラシを取得するコンバータ
ExitPositionConverter プラットホーム表示画面で使用する出口表示の位置をSystem.Windows.Thickness 構造体に変換するコンバータ
InvertBooleanConverter ブール値を反転するコンバータ
ReverseSignConverter 整数の正負を反転するコンバータ
PlatformWidthConverter プラットホーム表示画面で、車両の長さをもとにPlatformUnit等の長さを決定するコンバータ
RouteMapSelector RouteMapsプロパティの路線図のリストからインデックスを使用して目的の路線図を取得するコンバータ
RemoveLineFeed 文字列からU+000A(Line Feed, 改行)の文字を削除するコンバータ
SplitWithLineFeed 文字列をU+000A(Line Feed, 改行)の文字で分割し、分割文字列の配列を返すコンバータ
TrainOffsetConverter プラットホーム表示画面での列車の停止位置を、車両の長さをもとにしたオフセット長として決定するコンバータ
TransferDisplaySelector 駅毎に表示モードや言語によって複数定義される乗り換え路線情報から、必要なものを選択して取得するコンバータ

対応バージョン:0.2.0.0 以降

最終更新: