スターサイズ指定

FlexGrid のスターサイズ指定機能を使用すると、各列の幅を明示的に設定する代わりに、スターサイズ指定システムを使用して FlexGrid の列の幅を設定できます。スターサイズ指定は、すべての列が使用可能な画面スペースに収まるように、各列の幅を他の列との関連で自動的に決定します。データ全体が画面に表示されるので、水平スクロールが不要になります。スターサイズ指定を使用して、FlexGrid で柔軟なレイアウトを実装できます。以下のサンプルでは、オブジェクトの width プロパティでスターサイズ指定を使用しています。

FlexGrid の列の widthType の値を GridColumnWidthStar に設定してから、width プロパティの値を整数に設定します。以下の例では、最初の列の幅を 1、2 番目の列の幅を 2、3 番目の列の幅を 4 に設定しています。プロパティをこのように設定すると、次の図に示すように、FlexGrid の 2 番目の列の幅が最初の列の幅の 2 倍になり、3 番目の列の幅が最初の列の幅の 4 倍になります。

以下のコード例は、FlexGrid でスターサイズ指定を使用する方法を示します。この例では、「クイックスタート」のセクションで追加したデータソースを使用しています。

import UIKit
import XuniFlexGridKit

class StarSizingController: UIViewController {
    var grid = FlexGrid()

    override func viewDidLoad() {
        super.viewDidLoad()
        
        grid.columnHeaderFont = UIFont.boldSystemFontOfSize(grid.columnHeaderFont.pointSize)
        grid.autoGenerateColumns = false
        
        let c1 = GridColumn()
        c1.binding = "customerID"
        c1.header = "ID"
        c1.widthType = GridColumnWidth.Star
        c1.width = 1
        
        let c2 = GridColumn()
        c2.binding = "firstName"
        c2.header = "First Name"
        c2.widthType = GridColumnWidth.Star
        c2.width = 3
        
        let c3 = GridColumn()
        c3.binding = "lastName"
        c3.header = "Last Name"
        c3.widthType = GridColumnWidth.Star
        c3.width = 3
        
        grid.columns.addObject(c1)
        grid.columns.addObject(c2)
        grid.columns.addObject(c3)
        
        grid.itemsSource = CustomerData.getCustomerData(100)
        grid.isReadOnly = true
        grid.tag = 1
        self.view.addSubview(grid)
    }
    
    override func viewDidLayoutSubviews() {
        super.viewDidLayoutSubviews()
        
        if (self.navigationController == nil) {return;}
        
        let ss = UIApplication.sharedApplication().statusBarFrame.size.height + self.navigationController!.navigationBar.intrinsicContentSize().height;
        grid.frame = CGRectMake(0, ss, self.view.bounds.size.width, self.view.bounds.size.height - ss)
        grid.setNeedsDisplay()
    }
}

//必要なヘッダーファイルのインポート。
#import "ViewController.h"
#import <XuniFlexGridKit/XuniFlexGridKit.h>
#import <XuniCoreKit/XuniCoreKit.h>
#import "FlexGridDataSource.h"

@interface ViewController ()
@end

@implementation ViewController

- (void)viewDidLoad {
    [super viewDidLoad];
        // ビューを読み込んだ後の追加セットアップを行います（通常は nib から）。
    FlexGrid *grid = [[FlexGrid alloc] init];
    grid.autoGenerateColumns = false;
    
    //1番目の列の幅を定義します。
    GridColumn *c1 = [[GridColumn alloc] init];
    c1.binding = @"Id";
    //列の幅タイプをスターに定義します。
    c1.widthType = GridColumnWidthStar;
    c1.width = 1;
    
    grid.itemsSource = [FlexGridDataSource demo];
    
    //2番目の列の幅を定義します。
    GridColumn *c2 = [[GridColumn alloc] init];
    c2.binding = @"Amount";
    c2.format = @"C";
    c2.widthType = GridColumnWidthStar;
    c2.width = 2;
    
    //3番目の列の幅を定義します。
    GridColumn *c3 = [[GridColumn alloc] init];
    c3.binding = @"Country";
    c3.widthType = GridColumnWidthStar;
    c3.width = 4;
    
    //列オブジェクトを追加します。
    [grid.columns addObject:c1];
    [grid.columns addObject:c2];
    [grid.columns addObject:c3];
    
    grid.isReadOnly = true;
    grid.tag = 1;
    [self.view addSubview:grid];
}

- (void)viewDidLayoutSubviews{
    [super viewDidLayoutSubviews];
    FlexGrid *grid = (FlexGrid*)[self.view viewWithTag:1];
    
    CGFloat ss = [UIApplication sharedApplication].statusBarFrame.size.height + self.navigationController.navigationBar.intrinsicContentSize.height;
    grid.frame = CGRectMake(0, ss, self.view.bounds.size.width, self.view.bounds.size.height - ss);
    [grid setNeedsDisplay];
}
@end