前のページ次のページ上に戻るホーム SophiaFramework UNIVERSE 5.3

9.19. テーブルビュー

SFZTableView クラスの仕様

図 9.50. SFZTableView クラスの仕様

SFZTableView クラスの仕様

SFZTableView クラスは、 テーブルモデル(SFOTableModel)を表形式で操作するためのレスポンダです。

テーブルビュー(SFZTableView)は、 テーブルビューに表示する列の数だけのテーブルビューカラム(SFOTableViewColumn) とテーブルセルリアクター(SFOTableCellReactor)から構成されます。

テーブルビューカラムはテーブルビューの列を表し、 テーブルビューカラムはタイトルを表示するためのヘッダーとデータを表示・編集するためのテーブルセル(セル)から構成されます。

テーブルビューカラムにテーブルモデル(SFOTableModel)の列データであるテーブルモデルカラムを関連付けることにより、 テーブルビューは表形式でテーブルモデルのデータを表示したり編集することが可能になります。

SFZTableView / SFOTableViewColumn / SFOTableCellReactor クラスは、 それぞれテーブルビューの描画とキー処理、ヘッダーの描画、セルの描画とセル選択時の処理を行います。

テーブルモデル

テーブルモデル(SFOTableModel)は、 表形式のテーブルビュー(SFZTableView)に表示するデータのことで、 テーブルモデルとテーブルビューは互いに独立した存在になっています。

テーブルモデルは、 項目[行](SFXTableItemBase)の可変長配列(SFXArray)として表されます。

項目[行]は、 サイズがテーブルモデルカラム数(NUM)である、 セルオブジェクト(SFXAny)の固定長配列(SFXArray)として表されます。

※ テーブルモデルカラム数とは、テーブルモデルの列の数のことです。 テーブルモデルでは、列数は固定長、行数は可変長です。

テーブルモデルへのテーブルビューとテーブルビューカラムの関連付け

テーブルモデルは、 テーブルビューに関連付けることにより表形式でその内容を表示したり編集することが可能になります。

[Note] 注意

テーブルビューへのテーブルモデルの関連付けは、 SFZTableView::SetModel 関数を利用して行います。

テーブルビューカラムは、テーブルビューの列を表します。

テーブルビューカラムには、 テーブルモデルカラムと呼ぶテーブルモデルの列を関連付けます。

[Note] 注意

テーブルビューへのテーブルビューカラムの追加は、 SFZTableView::AddColumn 関数を利用して行います。

テーブルビューカラムとテーブルモデルカラムの関連付けは、 SFOTableViewColumn::NewInstance 関数、または SFOTableViewColumn::SetModelColumnIndex 関数を利用して行います。

同じテーブルモデルカラムを異なる複数のテーブルビューカラムに関連付けることにより、 テーブルモデルの同じ列のデータをテーブルビュー内に複数の列として表示することが可能です。

テーブルビューカラムとテーブルセルリアクターの関係

1 つのテーブルビューカラム(SFOTableViewColumn)付き 1 つのテーブルセルリアクター(SFOTableCellReactor)が必要になります。

[Note] 注意

テーブルビューカラムとテーブルセルリアクターの関連付けは、 SFOTableViewColumn::NewInstance 関数、または SFOTableViewColumn::SetCellReactor 関数を利用して行います。

デフォルトの具象テーブルセルリアクタークラスとして SFOTableCellTextReactor / SFOTableCellToggleReactor / SFOTableCellImageReactor クラスが提供されます。 テーブルビューの列単位で型は同じになりますが、 テーブルビューのセルにはテキスト、チェックボックス、画像を表示できます。 テキストとチェックボックスのセルは編集することも可能です。

SFZTableView / SFOTableViewColumn / SFOTableCellReactor の階層プロパティ

SFZTableViewSFOTableViewColumnSFOTableCellReactor の各クラスは、内部に階層プロパティ (SFXHierarchyProperty)を保持しています。

これらの階層プロパティの間には、

SFZTableView のプロパティ → SFOTableViewColumn のプロパティ → SFOTableCellReactor のプロパティ

というプロパティの親子関係(継承関係)が存在します。 子プロパティに存在しない属性は親プロパティから継承し、 親プロパティの属性を子プロパティでオーバーライドすることが可能です。

[Note] 注意

他のプロパティから継承されるプロパティを親プロパティ、 他のプロパティを継承するプロパティを子プロパティと呼びます。

また、親プロパティが存在しないプロパティをルートプロパティと呼びます。

階層プロパティの継承機能は、 テーブルビュー全体で定義したある属性について特定の列のヘッダーやセルにおいてだけ変更したい場合に利用できます。

プロパティの属性

階層プロパティ(SFXHierarchyProperty)は、 属性キーと属性値のマップから構成され、 属性キーは前景色やテキストのフォントといった様々な属性の種類を表します(参照: 以下の表「SFZTableView / SFOTableViewColumn / SFOTableCellReactor のプロパティ」)。

SFZTableView / SFOTableViewColumn / SFOTableCellReactor / SFOTableCellTextReactor / SFOTableCellToggleReactor / SFOTableCellImageReactor クラスが内部に保持する、 階層プロパティ(SFXHierarchyProperty)の内容は以下の表にある通りです。

[Note] 注意

デフォルト値が記入されている属性は、 テーブルビュー(SFZTableView)のプロパティ(ルートプロパティ)にすべて設定されています。

ただし、SFLPROP_LEFTTOP_MARGIN_SIZE / SFLPROP_RIGHTTOP_MARGIN_SIZE 属性を除きます。

表 9.22. SFZTableView / SFOTableViewColumn / SFOTableCellReactor のプロパティ

属性キー 属性値(デフォルト値) 解説
SFLPROP_FONT - フォント: この属性が設定されていない場合は AEE_FONT_NORMAL
SFLPROP_ALIGNMENT - アライメント: この属性が設定されていない場合は (IDF_ALIGN_CENTER | IDF_ALIGN_MIDDLE)
SFLPROP_EDITABLE - 編集可能であるかどうかどうか: この属性が設定されていない場合は false(編集不可)
SFLPROP_HORIZONTAL_RULED_LINE_ENABLE true 水平罫線を表示するかどうか: デフォルトの設定は、true(水平罫線は表示される)
SFLPROP_VERTICAL_RULED_LINE_ENABLE true 垂直罫線を表示するか: デフォルトの設定は、true(垂直罫線は表示される)
SFLPROP_FIXED_WIDTH - 横幅(固定)
SFLPROP_FIXED_HEIGHT - 縦幅(固定): この属性は未使用
SFLPROP_LEFTTOP_MARGIN_SIZE SFOTableCellToggleReactor の場合: (1, 1)、SFOTableCellTextReactor の場合: (2, 1) 左上マージンサイズ: この属性が設定されていない場合、マージンは (0, 0)
SFLPROP_RIGHTBOTTOM_MARGIN_SIZE SFOTableCellToggleReactor の場合: (1, 1)、SFOTableCellTextReactor の場合: (2, 1) 右下マージンサイズ: この属性が設定されていない場合、マージンは (0, 0)
SFLPROP_COLOR_GRADIENT_STYLE 0 グラディエーション表示にするかどうか(0: しない、1: する)
SFLPROP_HEADER_BEVEL_LIGHT_COLOR SFXRGBColor(0xFF, 0xFF, 0xFF, 0x00) ヘッダーのベベルカラーのライトカラー
SFLPROP_HEADER_BEVEL_BASE_COLOR SFXRGBColor(0xDD, 0xDD, 0xDD, 0x00) ヘッダーのベベルカラーのベースカラー
SFLPROP_HEADER_BEVEL_DARK_COLOR SFXRGBColor(0x88, 0x88, 0x88, 0x00) ヘッダーのベベルカラーのダークカラー
SFLPROP_HEADER_SEPARATOR_COLOR SFXRGBColor(0x6E, 0x6E, 0x6E, 0x00) ヘッダーセパレーターの色
SFLPROP_OUTER_BEVEL_LIGHT_COLOR SFXRGBColor(0xAA, 0xAA, 0xAA, 0x00) 外枠のベベルカラーのライトカラー
SFLPROP_OUTER_BEVEL_BASE_COLOR SFXRGBColor(0xFF, 0xFF, 0xFF, 0x00) 外枠のベベルカラーのベースカラー
SFLPROP_OUTER_BEVEL_DARK_COLOR SFXRGBColor(0xEE, 0xEE, 0xEE, 0x00) 外枠のベベルカラーのダークカラー
SFLPROP_INNER_BEVEL_LIGHT_COLOR SFXRGBColor(0x6E, 0x6E, 0x6E, 0x00) 内枠のベベルカラーのライトカラー
SFLPROP_INNER_BEVEL_BASE_COLOR SFXRGBColor(0xFF, 0xFF, 0xFF, 0x00) 内枠のベベルカラーのベースカラー
SFLPROP_INNER_BEVEL_DARK_COLOR SFXRGBColor(0xAA, 0xAA, 0xAA, 0x00) 内枠のベベルカラーのダークカラー
SFLPROP_BACKGROUND_COLOR - 背景色: この属性は未使用
SFLPROP_BACKGROUND_GRADIENT_COLOR - 背景をグラディエーション表示にする色: この属性は未使用
SFLPROP_FOREGROUND_COLOR - 前景色: この属性が設定されていない場合は SFXRGBColor(0x00, 0x00, 0x00, 0x00) [黒色]
SFLPROP_FOREGROUND_GRADIENT_COLOR - 前景をグラディエーション表示にする色: この属性は未使用
SFLPROP_SELECTED_BACKGROUND_COLOR SFXRGBColor(0x71, 0x9C, 0xE2, 0x00) 選択時(含む、フォーカス状態)の背景色
SFLPROP_SELECTED_BACKGROUND_GRADIENT_COLOR SFXRGBColor(0x71, 0x9C, 0xE2, 0x00) 選択時(含む、フォーカス状態)の背景をグラディエーション表示にする色
SFLPROP_SELECTED_FOREGROUND_COLOR - 選択時(含む、フォーカス状態)の前景色: この属性が設定されていない場合は SFXRGBColor(0xFF, 0xFF, 0xFF, 0x00) [白色]
SFLPROP_SELECTED_FOREGROUND_GRADIENT_COLOR - 選択時(含む、フォーカス状態)の前景をグラディエーション表示する色: この属性は未使用
SFLPROP_RULED_LINE_COLOR SFXRGBColor(0xF0, 0xF0, 0xF0, 0x00) 罫線の色
SFLPROP_RULED_LINE_COLOR - スクロールの方向: この属性が設定されていない場合は SFYSingleTextWidget::DEFAULT_DIRECTION
SFLPROP_TEXT_SCROLL_INTERVAL - スクロールインターバル[単位:ミリ秒]: この属性が設定されていない場合は SFYSingleTextWidget::DEFAULT_SCROLL
SFLPROP_TEXT_SCROLL_WAITINTERVAL - スクロール開始までの待ち時間[単位:ミリ秒]: この属性が設定されていない場合は SFYSingleTextWidget::DEFAULT_WAIT
SFLPROP_TEXT_SCROLL_STEP - スクロール移動量[単位:ピクセル]: この属性が設定されていない場合は SFYSingleTextWidget::DEFAULT_STEP
[Note] 注意

ユーザー定義クラスで 階層プロパティ(SFXHierarchyProperty)を使用する場合、 属性の解釈やデフォルト値は以下の内容に関係なく自由に変更・設定可能です。

また、SFLPROP_USER_CLASS_BEGIN(0x8000)から SFLPROP_USER_CLASS_END(0xFFFE) の間にユーザー独自の属性を定義することも可能です。

[Caution] 未使用の属性について

未使用の属性に値を設定しても何も行われません。

□サンプルコード

詳細なコードは、 こちら(mvcfactory.zip)を参照してください。

Void UserAppClass::Main(Void)
{
    static ACharConst                           marks[][16] = {
        "sun",
        "cloud",
        "snowman",
        "star",
        "white star",
        "telephone",
        "spade",
        "heart",
        "diamond",
        "club",
        "quaver",
        "semiquaver"
    };
    SFZScrollBarControlSmp                      bar;
    SFZTableViewSmp                             view;
    SFOTableModelSmp                            model;
    SFOTableViewColumnSmp                       vcol;
    SFOTableCellReactorSmp                      rtor;
    SFXTableItem<3>                             item;
    SFBImageSmp                                 icon[12];

    // ■■■ テーブルビューの作成 ■■■ 

    view = SFZTableView::NewInstance();

    view->SetParent(GetThis());
    view->SetRealBound(GetLocalBound().Deflate(5, 5, 10, 5));
    view->SetState(true, true, true, true);

    // 行の高さを 24 に設定する
    view->SetItemHeight(24);

    // 横向きにカーソルをループする
    view->SetXLoop(true);

    // 縦向きにカーソルをループする
    view->SetYLoop(true);

    // スクロールバーを生成する
    bar = SFZScrollBarControl::NewInstance();

    bar->SetParent(GetThis());
    SFXRectangle bound(view->GetRealBound());
    bar->SetRealBound(bound.AddX(bound.GetWidth()).SetWidth(5));
    bar->SetState(true, true, false, false);

    // テーブルビューにスクロールバーを設定する
    view->SetScrollBarControl(bar);

    // ■■■ テーブルモデルの作成 ■■■ 

    // テーブルモデルを生成する
    model = SFOTableModel::NewInstance();

    // アイコン画像をリソースファイルから取得する
    for (SInt16 i = 0; i < 12; i++) {
        icon[i] = SFBShell::GetInstance()->LoadResImage("userapp.bar", IDI_OBJECT_5001 + i);
    }

    // アイテムに各テーブルモデルカラムのデータをセットして追加する
    for (SInt32 row = 0; row < 60; ++row) {
        item.data[0] = SFXAnsiString(marks[row % 12]);
        item.data[1] = icon[row % 12];
        item.data[2] = static_cast<Bool>(row % 2);
        model->InsertLast(item);
    }

    // ■■■ テーブルビューとテーブルモデルの関連付け ■■■ 

    view->SetModel(model);

    // ■■■ 第 1 列目のテーブルビューカラムの作成 ■■■ 

    // テーブルセルトグルリアクターを作成する
    rtor = SFOTableCellToggleReactor::NewInstance();

    // 編集可に設定する
    rtor->SetProperty(SFLPROP_EDITABLE, true);

    // 第 3 列目のテーブルモデルカラム(Bool 型)と関連付ける: ヘッダーのタイトルは "(空文字列)
    vcol = SFOTableViewColumn::NewInstance(", 2, rtor);

    // 固定幅 24 に設定する
    vcol->SetProperty(SFLPROP_FIXED_WIDTH, 24);

    // テーブルビューにテーブルビューカラムを追加する
    view->AddColumn(vcol);

    // ■■■ 第 2 列目のテーブルビューカラムの作成 ■■■ 

    // イメージセルテキストリアクターを作成する
    rtor = SFOTableCellImageReactor::NewInstance();

    // 第 2 列目のテーブルモデルカラム(SFBImageSmp 型)と関連付ける: ヘッダーのタイトルは "(空文字列)
    vcol = SFOTableViewColumn::NewInstance(", 1, rtor);

    // 固定幅を 24 に設定する
    vcol->SetProperty(SFLPROP_FIXED_WIDTH, 24);

    // テーブルビューにテーブルビューカラムを追加する
    view->AddColumn(vcol);

    // ■■■ 第 3 列目のテーブルビューカラムの作成 ■■■ 

    // テーブルセルテキストリアクターを作成する
    rtor = SFOTableCellTextReactor::NewInstance();
    // 編集可に設定する
    rtor->SetProperty(SFLPROP_EDITABLE, true);

    // 第 1 列目のテーブルモデルカラム(SFXAnsiString 型)と関連付ける: ヘッダーのタイトルは "marks" 
    vcol = SFOTableViewColumn::NewInstance("marks", 0, rtor);

    // アライメントを左詰めに設定する
    vcol->SetProperty(SFLPROP_ALIGNMENT, IDF_ALIGN_LEFT | IDF_ALIGN_MIDDLE);

    // テーブルビューにテーブルビューカラムを追加する
    view->AddColumn(vcol);

    return;
}

図 9.51. SFZTableView クラスの動作例

SFZTableView クラスの動作例