// ドロップダウン電卓を設定します。
var calStyle = new GC.Spread.Sheets.Style();
calStyle.cellButtons = [
{
  imageType: GC.Spread.Sheets.ButtonImageType.dropdown,
  command: "openCalculator",
  useButtonStyle: true,
}];
activeSheet.setText(2, 3, "ドロップダウン電卓");
activeSheet.setStyle(2, 4, calStyle);

// ドロップダウン日付時刻ピッカーを設定します。
var dateTimeStyle = new GC.Spread.Sheets.Style();
dateTimeStyle.cellButtons = [
{
  imageType: GC.Spread.Sheets.ButtonImageType.dropdown,
  command: "openDateTimePicker",
  useButtonStyle: true,
}];
dateTimeStyle.dropDowns = [
{
  type: GC.Spread.Sheets.DropDownType.dateTimePicker,
  option: {
    showTime: true,
  }
}];
activeSheet.setText(4, 3, "ドロップダウン日付時刻ピッカー");
activeSheet.setStyle(4, 4, dateTimeStyle);

// ドロップダウン月ピッカーを設定します。
var monthPickerStyle = new GC.Spread.Sheets.Style();
monthPickerStyle.cellButtons = [
{
  imageType: GC.Spread.Sheets.ButtonImageType.dropdown,
  command: "openMonthPicker",
  useButtonStyle: true,
}];
monthPickerStyle.dropDowns = [
{
  type: GC.Spread.Sheets.DropDownType.monthPicker,
  option: {
    startYear: 2009,
    stopYear: 2019,
    height: 300,
  }
}];
activeSheet.setText(6, 3, "ドロップダウン月ピッカー");
activeSheet.setStyle(6, 4, monthPickerStyle);

// ドロップダウン時刻ピッカーを設定します。
var timePickerStyle = new GC.Spread.Sheets.Style();
timePickerStyle.cellButtons = [
{
  imageType: GC.Spread.Sheets.ButtonImageType.dropdown,
  command: "openTimePicker",
  useButtonStyle: true,
}];
timePickerStyle.dropDowns = [
{
  type: GC.Spread.Sheets.DropDownType.timePicker,
  option: {
    min: {
      hour: 8
    },
    max: {
      hour: 19
    },
    step: {
      minute: 30
    },
    formatString: "h:mm 午前/午後",
  }
}];
activeSheet.setText(8, 3, "ドロップダウン時刻ピッカー");
activeSheet.setStyle(8, 4, timePickerStyle);

// ドロップダウンカラーピッカーを設定します。
var colorPickerStyle = new GC.Spread.Sheets.Style();
colorPickerStyle.cellButtons = [
{
  imageType: GC.Spread.Sheets.ButtonImageType.dropdown,
  command: "openColorPicker",
  useButtonStyle: true,
}];
activeSheet.setText(10, 3, "ドロップダウンカラーピッカー");
activeSheet.setStyle(10, 4, colorPickerStyle);

// ドロップダウンリストを設定します。
var listStyle = new GC.Spread.Sheets.Style();
listStyle.cellButtons = [
{
  imageType: GC.Spread.Sheets.ButtonImageType.dropdown,
  command: "openList",
  useButtonStyle: true,
}];
listStyle.dropDowns = [
{
  type: GC.Spread.Sheets.DropDownType.list,
  option: {
    items: [
    {
      text: '項目1',
      value: 'item1'
    },
    {
      text: '項目2',
      value: 'item2'
    },
    {
      text: '項目3',
      value: 'item3'
    },
    {
      text: '項目4',
      value: 'item4'
    }],
  }
}];
activeSheet.setText(12, 3, "ドロップダウンリスト");
activeSheet.setStyle(12, 4, listStyle);

 // リストのデータを設定します。
 var listData = {
     multiSelect: true,
      items: [
             {
                text: 'SpreadSheets',
                value: 'SpreadSheets',
                layout: { displayAs: GC.Spread.Sheets.LayoutDisplayAs.popup },
                items: [
                    {
                        text: 'Spread.NET',
                        value: 'Spread.NET'
                    },
                    {
                        text: 'SpreadJS',
                        value: 'SpreadJS'
                    },
                    {
                        text: 'Spread COM',
                        value: 'Spread COM'
                    },
                    {
                        text: 'DataViewJS',
                        value: 'DataViewJS'
                    }
                ]
            },
            {
                text: 'Javascript',
                value: 'Javascript',
            },
            {
                text: 'Reporting',
                value: 'Reporting',
            },
            {
                text: 'Document APIS',
                value: 'Document APIS',
                layout: { displayAs: GC.Spread.Sheets.LayoutDisplayAs.popup },
                items: [
                    {
                        text: 'Documents for Excel',
                        value: 'Documents for Excel'
                    },
                    {
                        text: 'Excel Template Language',
                        value: 'Excel Template Language'
                    },
                    {
                        text: 'Documents for PDF',
                        value: 'Documents for PDF'
                    },
                    {
                        text: 'Documents for PDF Viewer',
                        value: 'Documents for PDF Viewer'
                    },
                    {
                        text: 'Documents for Microsoft Word',
                        value: 'Documents for Microsoft Word'
                    },
                    {
                        text: 'Documents for Imaging',
                        value: 'Documents for Imaging'
                    }
                ]
            }
        ]
    };
    var style = new GC.Spread.Sheets.Style();
    style.cellButtons = [
        {
            imageType: GC.Spread.Sheets.ButtonImageType.dropdown,
            command: "openList",
            useButtonStyle: true,
        }
    ];
    style.dropDowns = [
        {
            type: GC.Spread.Sheets.DropDownType.list,
            option: listData
        }
    ];
    activeSheet.setStyle(0, 0, style);
});

// ドロップダウンスライダーを設定します。
var horizontalSliderStyle = new GC.Spread.Sheets.Style();
horizontalSliderStyle.cellButtons = [
{
  imageType: GC.Spread.Sheets.ButtonImageType.dropdown,
  command: "openSlider",
  useButtonStyle: true,
}];
horizontalSliderStyle.dropDowns = [
{
  type: GC.Spread.Sheets.DropDownType.slider,
  option: {
    marks: [0, 50, 100],
    step: 10,
    direction: GC.Spread.Sheets.LayoutDirection.horizontal,
  }
}];
activeSheet.setText(14, 3, "ドロップダウンスライダー");
activeSheet.setStyle(14, 4, horizontalSliderStyle);

//ドロップダウンワークフローリストを設定します。
let workflowListStyle = new GC.Spread.Sheets.Style();
workflowListStyle.cellButtons = [
{
  imageType: GC.Spread.Sheets.ButtonImageType.dropdown,
  command: "openWorkflowList",
  useButtonStyle: true,
}];
workflowListStyle.dropDowns = [
{
  type: GC.Spread.Sheets.DropDownType.workflowList,
  option: {
    items: [
    {
      value: "新規作成",
      transitions: [1]
    },
    {
      value: "開く",
      transitions: [0, 2, 3, 5]
    },
    {
      value: "処理中",
      transitions: [1, 3, 5]
    },
    {
      value: "解決済み",
      transitions: [5, 4]
    },
    {
      value: "再度開く",
      transitions: [5, 3, 2]
    },
    {
      value: "終了済み",
      transitions: [4]
    }, ]
  }
}];
activeSheet.setText(16, 3, "ドロップダウンワークフローリスト");
activeSheet.setStyle(16, 4, workflowListStyle);