カスケードピッカー - Mobile Platform as a Service - Alibaba Cloud ドキュメントセンター

AUCascadePicker は、最大 3 レベルの階層構造をサポートするマルチレベルのカスケードピッカーコントロールです。

プレビュー

API リファレンス

// ピッカーの選択項目を設定します。
@interface AUCascadePickerSelectedRowItem : NSObject

@property (nonatomic, strong) NSString *selectedLeftTitle;    // 最上位サブリスト内の選択項目のタイトル。
@property (nonatomic, strong) NSString *selectedMiddleTitle;  // 中間サブリスト内の選択項目のタイトル。
@property (nonatomic, strong) NSString *selectedRightTitle;   // 最下位サブリスト内の選択項目のタイトル。

@end

@interface  AUCascadePickerRowItemModel : NSObject

@property (nonatomic, strong) NSString *rowTitle;
@property (nonatomic, strong) NSArray<AUCascadePickerRowItemModel *> *rowSubList;

@end

// フィルターの相互作用に必要なデータモデル。
@interface AUCascadePickerModel : NSObject

@property (nonatomic,strong) AUCascadePickerSelectedRowItem            *preSelected;   // 事前に選択済みの項目。
@property (nonatomic, strong) AUCascadePickerSelectedRowItem           *selectedItem;  // 現在のコンポーネント内で記録された選択済みデータの一覧。
@property (nonatomic, strong) NSArray<AUCascadePickerRowItemModel *>   *dataList ;     // データ一覧。
@property (nonatomic, strong) NSString *title;                                         // ピッカーのタイトル。

@end


@interface AUCascadePicker : AUPickerBaseView <UIPickerViewDataSource, UIPickerViewDelegate>

@property (nonatomic, strong) AUCascadePickerModel *dataModel;
@property (nonatomic, assign) NSInteger numberOfComponents;
@property (nonatomic, weak) id <AUCascadePickerDelegate> linkageDelegate;

- (instancetype)initWithPickerModel:(AUCascadePickerModel *)model;

@end

// 画面上部の「キャンセル」および「完了」ボタンに対するコールバック。
@protocol AUCascadePickerDelegate <AUPickerBaseViewDelegate>
/*
 * キャンセルがタップされた際のコールバック。
 */
- (void)cancelPickerView:(AUCustomDatePicker *)pickerView;

/*
 * 完了がタップされた際のコールバック。選択項目は selectedRowInComponent を通じて取得できます。
 */
- (void)selectedPickerView:(AUCustomDatePicker *)pickerView

@end

JSAPI リファレンス

API：antUIGetCascadePicker

使用例

AlipayJSBridge.call('antUIGetCascadePicker',
{
    title: 'こんにちは',// カスケードピッカーのタイトル。
    selectedList:[{"name":"杭州",subList:[{"name":"上城区"}]}],
    list: [
        {
            name: "杭州",// 項目の名称。
            subList: [
                {
                    name: "西湖区",
                    subList: [
                        {
                            name: "古翠街道"
                        },
                        {
                            name: "文新街道"
                        }
                    ]
                },
                {
                    name: "上城区",
                    subList: [
                        {
                            name: "延安路"
                        },
                        {
                            name: "龍翔橋街"
                        }
                    ]
                }
            ]// カスケード形式のサブリスト。
        }
    ]// カスケード形式のデータ一覧。
},
function(result){
    console.log(result);
});

入力パラメーター

プロパティ	型	説明	必須	バージョン
title	String	カスケードコントロールのタイトル。	いいえ	10.1.2
selectedList	Json	選択状態。選択済みのサブ項目を指定します。フォーマットはリクエストパラメーターと同一です。例：`[{"name":"杭州",subList:[{"name":"上城区"}]}]`。	いいえ	10.1.2
list	Json	ピッカー用のデータ一覧。	はい	10.1.2
name	String	リスト内の項目の名称。	はい	10.1.2
subList	Json	サブ項目一覧。これはリスト内のサブリストです。	いいえ	10.1.2
fn	Function	選択後に実行されるコールバック関数。	いいえ	10.1.2

出力パラメーター

プロパティ	型	説明	バージョン
success	bool	選択操作が完了したかどうかを示します。操作がキャンセルされた場合は false を返します。	10.1.2
result	Json	選択結果。例：`[{"name":"杭州",subList:[{"name":"上城区"}]}]`。	10.1.2

コード例

    model = [[AULinkagePickerModel alloc] init];

    NSMutableArray *modelList = [[NSMutableArray alloc] init];
    for (int i=0; i<6; i++)
    {
        AULinkagePickerRowItemModel *item = [[AULinkagePickerRowItemModel alloc] init];
        item.rowTitle = [NSString stringWithFormat:@"レイヤー 1: %d", i];
        NSMutableArray *array = [[NSMutableArray alloc] init];
        for (int j=0; j<7; j++)
        {
            if (i == 0)
            {
                break;
            }
            AULinkagePickerRowItemModel *item1 = [[AULinkagePickerRowItemModel alloc] init];
            item1.rowTitle = [NSString stringWithFormat:@"レイヤー 2: %d", j];
            NSMutableArray *array1 = [[NSMutableArray alloc] init];
            for (int k=0; k<5; k++) {
                AULinkagePickerRowItemModel *item2 = [[AULinkagePickerRowItemModel alloc] init];
                item2.rowTitle = [NSString stringWithFormat:@"レイヤー 3: %d", k];
                [array1 addObject:item2];
                if (j == 1 || j== 2) {
                    break;
                }
            }
            item1.rowSubList = array1;
            [array addObject:item1];
            if (i == 3 || i== 5) {
                break;
            }
        }
        item.rowSubList = array;
        [modelList addObject:item];
    }

    model.dataList = modelList;


    AULinkagePickerSelectedRowItem *item = [[AULinkagePickerSelectedRowItem alloc] init];
    item.selectedLeftTitle = @"レイヤー 1: 0";
    item.selectedMiddleTitle = @"レイヤー 2: 0";
    item.selectedRightTitle = @"レイヤー 3: 0";

    model.selectedItem = item;

self.linkagePickerView = [[AULinkagePickerView alloc] initWithPickerModel:model];
self.linkagePickerView.linkageDelegate = self;
[self.linkagePickerView show];