SPREAD for ASP.NETデモアプリケーション

SPREADではコマンドバーの表示をカスタマイズすることが可能です。コマンドバーのボタンは、画像ボタン、プッシュボタンに変更でき、ボタンに表示する画像や文字列は任意に変更可能です。

このサンプルでは、シートごとにカスタマイズ方法を変更しています。
「デフォルト」シートはデフォルト状態のコマンドバーです。
「テキスト」シートはボタンをプッシュボタンに変更しています。
「ボタンカスタム」シートはボタンを画像に変更しています。
「テキストカスタム」シートはボタンをプッシュボタンに変更し、ボタンに表示する文字列を変更しています。

	ID	氏名	カナ	生年月日	性別	血液型	部署	入社日	メールアドレス
1	1001	亀甲　滋万	ｷｺｳｼｹﾞﾏ	1950/02/04	男	A	人事部	1972/04/01	sigema_kikou@abc.co.jp
2	1002	寒田　希世	ｶﾝﾀﾞｷﾖ	1959/06/28	女	B	人事部	1981/04/01	kiyo_kanda@bbb.or.jp
3	1003	小和瀬　澄	ｵﾜｾｷﾖ	1969/03/06	男	A	人事部	1991/04/01	kiyo_owase@aaa.co.jp
4	1004	宇夫　早余子	ｳﾌﾞｻﾖｺ	1976/07/28	女	O	人事部	1998/04/01	sayoko_ubu@bbb.or.jp
5	1005	宇田津　聖智	ｳﾀﾞﾂｷﾖﾄﾓ	1965/09/04	男	A	営業部	1987/04/01	kiyotomo_udatu@abc.co.jp
6	1006	茨城　昭児	ｲﾊﾞﾗｷｼｮｳｼﾞ	1963/04/28	男	O	営業部	1985/04/01	shouzi_ibaraki@xyz.ne.jp
7	1007	石ヶ休　椎茄	ｲｼｶﾞｷｭｳｼｲﾅ	1953/02/21	男	O	営業部	1975/04/01	siina_isigagyuu@abc.co.jp
8	1008	赤司　恵治郎	ｱｶﾂｶｻｹｲｼﾞﾛｳ	1968/08/02	男	O	経理部	1990/04/01	keizirou_akatukasa@abc.co.jp
9	1009	小橋　仰一	ｵﾊｼｷﾞｮｳｲﾁ	1972/03/02	男	B	経理部	1994/04/01	gyouiti_ohasi@abc.co.jp
10	1010	一重　公大	ｲﾁｼﾞｭｳｺｳﾀﾞｲ	1964/04/19	男	B	経理部	1986/04/01	koudai_itizyuu@xyz.ne.jp

デフォルト

テキスト

ボタンカスタム

...

ソースコード

C#
VB
ASPX

別ウィンドウで表示

using System;
using System.Data;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.Configuration;

public partial class commandbarstyle : System.Web.UI.Page
{
    protected void Page_Load(object sender, EventArgs e)
    {
        if (IsPostBack) return;

        FpSpread1.Sheets.Count = 4;
        for (int i = 0; i < FpSpread1.Sheets.Count; i++)
        {
            // データ連結
            DataSet ds = new DataSet();
            ds.ReadXml(MapPath("../App_Data/data50.xml"));
            FpSpread1.Sheets[i].DataSource = ds;
            
            // SPREAD初期化
            InitSpread(FpSpread1.Sheets[i]);            
        }

        // SPREAD設定
        FpSpread1.CommandBar.Visible = true;
        FpSpread1.CssClass = "spreadStyle";
        FpSpread1.UseClipboard = false;
        
        // シート名設定
        FpSpread1.Sheets[0].SheetName ="デフォルト";
        FpSpread1.Sheets[1].SheetName ="テキスト";
        FpSpread1.Sheets[2].SheetName ="ボタンカスタム";
        FpSpread1.Sheets[3].SheetName = "テキストカスタム";
    }

    private void InitSpread(FarPoint.Web.Spread.SheetView sheet)
    {
        // シート設定
        sheet.PageSize = 10;

        // フォントサイズの設定
        sheet.DefaultStyle.Font.Size = FontUnit.Parse("80%");
        sheet.ColumnHeader.DefaultStyle.Font.Size = FontUnit.Parse("80%");
        sheet.RowHeader.DefaultStyle.Font.Size = FontUnit.Parse("80%");
        sheet.SheetCorner.DefaultStyle.Font.Size = FontUnit.Parse("80%");

        // 列幅の設定
        sheet.Columns[0].Width = 45;
        sheet.Columns[1].Width = 85;
        sheet.Columns[2].Width = 120;
        sheet.Columns[3].Width = 80;
        sheet.Columns[4].Width = 50;
        sheet.Columns[5].Width = 50;
        sheet.Columns[6].Width = 65;
        sheet.Columns[7].Width = 80;
        sheet.Columns[8].Width = 140;

        // 縦方向の揃え位置を中央に設定
        sheet.DefaultStyle.VerticalAlign = VerticalAlign.Middle;
    }

    // コマンドバーにカスタムテキストを設定
    private void SetCustomText(FarPoint.Web.Spread.CreateButtonEventArgs e)
    {
        switch (e.Command)
        {
            case "Update":
                e.Label = "確定";
                break;
            case "Cancel":
                e.Label = "ｷｬﾝｾﾙ";
                break;
            case "Cut":
                e.Label = "ｶｯﾄ";
                break;
            case "Copy":
                e.Label = "ｺﾋﾟｰ";
                break;
            case "Paste":
                e.Label = "ﾍﾟｰｽﾄ";
                break;
            case "Add":
                e.Label = "追加";
                break;
            case "Insert":
                e.Label = "挿入";
                break;
            case "Delete":
                e.Label = "削除";
                break;
            case "Prev":
                e.Label = "前ﾍﾟｰｼﾞ";
                break;
            case "Next":
                e.Label = "次ﾍﾟｰｼﾞ";
                break;
        }
    }

    // コマンドバーにカスタムピクチャを設定
    private void SetCustomPicture(FarPoint.Web.Spread.CreateButtonEventArgs e)
    {
        string imgdir = "../images/commandbar/";
        switch (e.Command)
        {
            case "Update":
                e.EnabledImgUrl = imgdir + "Update.gif";
                e.DisabledImgUrl = imgdir + "UpdateDisable.gif";
                break;
            case "Cancel":
                e.EnabledImgUrl = imgdir + "Cancel.gif";
                e.DisabledImgUrl = imgdir + "CancelDisable.gif";
                break;
            case "Cut":
                e.EnabledImgUrl = imgdir + "Clear.gif";
                e.DisabledImgUrl = imgdir + "ClearDisable.gif";
                break;
            case "Copy":
                e.EnabledImgUrl = imgdir + "Copy.gif";
                e.DisabledImgUrl = imgdir + "CopyDisable.gif";
                break;
            case "Paste":
                e.EnabledImgUrl = imgdir + "Paste.gif";
                e.DisabledImgUrl = imgdir + "PasteDisable.gif";
                break;
            case "Add":
                e.EnabledImgUrl = imgdir + "Add.gif";
                e.DisabledImgUrl = imgdir + "AddDisable.gif";
                break;
            case "Insert":
                e.EnabledImgUrl = imgdir + "Insert.gif";
                e.DisabledImgUrl = imgdir + "InsertDisable.gif";
                break;
            case "Delete":
                e.EnabledImgUrl = imgdir + "Delete.gif";
                e.DisabledImgUrl = imgdir + "DeleteDisable.gif";
                break;
            case "Prev":
                e.EnabledImgUrl = imgdir + "Prev.gif";
                e.DisabledImgUrl = imgdir + "PrevDisable.gif";
                break;
            case "Next":
                e.EnabledImgUrl = imgdir + "Next.gif";
                e.DisabledImgUrl = imgdir + "NextDisable.gif";
                break;
        }

    }
    protected void FpSpread1_CreateButton(object sender, FarPoint.Web.Spread.CreateButtonEventArgs e)
    {
        // カスタムコマンドバーの設定
        if (FpSpread1.ActiveSheetViewIndex == 2)
        {
            // コマンドバーにカスタムピクチャを設定
            SetCustomPicture(e);
        }
        else if (FpSpread1.ActiveSheetViewIndex == 3)
        {
            // コマンドバーにカスタムテキストを設定
            SetCustomText(e);
        }
    }

    protected void FpSpread1_ActiveSheetChanged(object sender, EventArgs e)
    {
        // コマンドボタンの表示を変更 
        FpSpread1.CommandBar.Reset();
        FpSpread1.CommandBar.Font.Size = FontUnit.Small;

        // シートごとに、コマンドバーの表示状態を変更
        switch (FpSpread1.ActiveSheetViewIndex)
        {
            case 0:		// デフォルトボタン
                // ボタンのタイプを変更
                FpSpread1.CommandBar.ButtonType = FarPoint.Web.Spread.ButtonType.ImageButton;
                break;
            case 1:		// デフォルトテキスト
                // ボタンのタイプを変更
                FpSpread1.CommandBar.ButtonType = FarPoint.Web.Spread.ButtonType.PushButton;
                break;
            case 2:		// カスタムボタン
                // ボタンのタイプを変更
                FpSpread1.CommandBar.ButtonType = FarPoint.Web.Spread.ButtonType.ImageButton;
                FpSpread1.CommandBar.BackColor = System.Drawing.Color.BurlyWood;
                break;
            case 3:		// カスタムテキスト
                // ボタンのタイプを変更
                FpSpread1.CommandBar.ButtonType = FarPoint.Web.Spread.ButtonType.PushButton;
                // ボタンの設定を変更します。
                FpSpread1.CommandBar.BackColor = System.Drawing.Color.DarkBlue;
                FpSpread1.CommandBar.ButtonFaceColor = System.Drawing.Color.MediumAquamarine;
                FpSpread1.CommandBar.ButtonHighlightColor = System.Drawing.Color.MintCream;
                FpSpread1.CommandBar.ButtonShadowColor = System.Drawing.Color.DarkCyan;
                FpSpread1.CommandBar.ButtonTextColor = System.Drawing.Color.Blue;
                FpSpread1.CommandBar.Font.Bold = true;
                break;
        }
    }
}


Partial Public Class commandbarstyle
    Inherits System.Web.UI.Page

    Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load
        If IsPostBack Then
            Return
        End If

        FpSpread1.Sheets.Count = 4
        For i As Integer = 0 To FpSpread1.Sheets.Count - 1
            ' データ連結
            Dim ds As New System.Data.DataSet()
            ds.ReadXml(MapPath("../App_Data/data50.xml"))
            FpSpread1.Sheets(i).DataSource = ds

            ' SPREAD初期化
            InitSpread(FpSpread1.Sheets(i))
        Next

        ' SPREAD設定
        FpSpread1.CommandBar.Visible = True
        FpSpread1.CssClass = "spreadStyle"
        FpSpread1.UseClipboard = False

        ' シート名設定
        FpSpread1.Sheets(0).SheetName = "デフォルト"
        FpSpread1.Sheets(1).SheetName = "テキスト"
        FpSpread1.Sheets(2).SheetName = "ボタンカスタム"
        FpSpread1.Sheets(3).SheetName = "テキストカスタム"
    End Sub

    Private Sub InitSpread(ByVal sheet As FarPoint.Web.Spread.SheetView)
        ' シート設定
        sheet.PageSize = 10

        ' フォントサイズの設定
        sheet.DefaultStyle.Font.Size = FontUnit.Parse("80%")
        sheet.ColumnHeader.DefaultStyle.Font.Size = FontUnit.Parse("80%")
        sheet.RowHeader.DefaultStyle.Font.Size = FontUnit.Parse("80%")
        sheet.SheetCorner.DefaultStyle.Font.Size = FontUnit.Parse("80%")

        ' 列幅の設定
        sheet.Columns(0).Width = 45
        sheet.Columns(1).Width = 85
        sheet.Columns(2).Width = 120
        sheet.Columns(3).Width = 80
        sheet.Columns(4).Width = 50
        sheet.Columns(5).Width = 50
        sheet.Columns(6).Width = 65
        sheet.Columns(7).Width = 80
        sheet.Columns(8).Width = 140

        ' 縦方向の揃え位置を中央に設定
        sheet.DefaultStyle.VerticalAlign = VerticalAlign.Middle
    End Sub

    ' コマンドバーにカスタムテキストを設定
    Private Sub SetCustomText(ByVal e As FarPoint.Web.Spread.CreateButtonEventArgs)
        Select Case e.Command
            Case "Update"
                e.Label = "確定"
                Exit Select
            Case "Cancel"
                e.Label = "ｷｬﾝｾﾙ"
                Exit Select
            Case "Cut"
                e.Label = "ｶｯﾄ"
                Exit Select
            Case "Copy"
                e.Label = "ｺﾋﾟｰ"
                Exit Select
            Case "Paste"
                e.Label = "ﾍﾟｰｽﾄ"
                Exit Select
            Case "Add"
                e.Label = "追加"
                Exit Select
            Case "Insert"
                e.Label = "挿入"
                Exit Select
            Case "Delete"
                e.Label = "削除"
                Exit Select
            Case "Prev"
                e.Label = "前ﾍﾟｰｼﾞ"
                Exit Select
            Case "Next"
                e.Label = "次ﾍﾟｰｼﾞ"
                Exit Select
        End Select
    End Sub

    ' コマンドバーにカスタムピクチャを設定
    Private Sub SetCustomPicture(ByVal e As FarPoint.Web.Spread.CreateButtonEventArgs)
        Dim imgdir As String = "../images/commandbar/"
        Select Case e.Command
            Case "Update"
                e.EnabledImgUrl = imgdir & "Update.gif"
                e.DisabledImgUrl = imgdir & "UpdateDisable.gif"
                Exit Select
            Case "Cancel"
                e.EnabledImgUrl = imgdir & "Cancel.gif"
                e.DisabledImgUrl = imgdir & "CancelDisable.gif"
                Exit Select
            Case "Cut"
                e.EnabledImgUrl = imgdir & "Clear.gif"
                e.DisabledImgUrl = imgdir & "ClearDisable.gif"
                Exit Select
            Case "Copy"
                e.EnabledImgUrl = imgdir & "Copy.gif"
                e.DisabledImgUrl = imgdir & "CopyDisable.gif"
                Exit Select
            Case "Paste"
                e.EnabledImgUrl = imgdir & "Paste.gif"
                e.DisabledImgUrl = imgdir & "PasteDisable.gif"
                Exit Select
            Case "Add"
                e.EnabledImgUrl = imgdir & "Add.gif"
                e.DisabledImgUrl = imgdir & "AddDisable.gif"
                Exit Select
            Case "Insert"
                e.EnabledImgUrl = imgdir & "Insert.gif"
                e.DisabledImgUrl = imgdir & "InsertDisable.gif"
                Exit Select
            Case "Delete"
                e.EnabledImgUrl = imgdir & "Delete.gif"
                e.DisabledImgUrl = imgdir & "DeleteDisable.gif"
                Exit Select
            Case "Prev"
                e.EnabledImgUrl = imgdir & "Prev.gif"
                e.DisabledImgUrl = imgdir & "PrevDisable.gif"
                Exit Select
            Case "Next"
                e.EnabledImgUrl = imgdir & "Next.gif"
                e.DisabledImgUrl = imgdir & "NextDisable.gif"
                Exit Select
        End Select

    End Sub

    Protected Sub FpSpread1_ActiveSheetChanged(ByVal sender As Object, ByVal e As System.EventArgs) Handles FpSpread1.ActiveSheetChanged
        ' コマンドボタンの表示を変更 
        FpSpread1.CommandBar.Reset()
        FpSpread1.CommandBar.Font.Size = FontUnit.Small

        ' シートごとに、コマンドバーの表示状態を変更
        Select Case FpSpread1.ActiveSheetViewIndex
            Case 0
                ' デフォルトボタン
                ' ボタンのタイプを変更
                FpSpread1.CommandBar.ButtonType = FarPoint.Web.Spread.ButtonType.ImageButton
                Exit Select
            Case 1
                ' デフォルトテキスト
                ' ボタンのタイプを変更
                FpSpread1.CommandBar.ButtonType = FarPoint.Web.Spread.ButtonType.PushButton
                Exit Select
            Case 2
                ' カスタムボタン
                ' ボタンのタイプを変更
                FpSpread1.CommandBar.ButtonType = FarPoint.Web.Spread.ButtonType.ImageButton
                FpSpread1.CommandBar.BackColor = System.Drawing.Color.BurlyWood
                Exit Select
            Case 3
                ' カスタムテキスト
                ' ボタンのタイプを変更
                FpSpread1.CommandBar.ButtonType = FarPoint.Web.Spread.ButtonType.PushButton
                ' ボタンの設定を変更します。
                FpSpread1.CommandBar.BackColor = System.Drawing.Color.DarkBlue
                FpSpread1.CommandBar.ButtonFaceColor = System.Drawing.Color.MediumAquamarine
                FpSpread1.CommandBar.ButtonHighlightColor = System.Drawing.Color.MintCream
                FpSpread1.CommandBar.ButtonShadowColor = System.Drawing.Color.DarkCyan
                FpSpread1.CommandBar.ButtonTextColor = System.Drawing.Color.Blue
                FpSpread1.CommandBar.Font.Bold = True
                Exit Select
        End Select
    End Sub

    Protected Sub FpSpread1_CreateButton(ByVal sender As Object, ByVal e As FarPoint.Web.Spread.CreateButtonEventArgs) Handles FpSpread1.CreateButton
        ' カスタムコマンドバーの設定
        If FpSpread1.ActiveSheetViewIndex = 2 Then
            ' コマンドバーにカスタムピクチャを設定
            SetCustomPicture(e)
        ElseIf FpSpread1.ActiveSheetViewIndex = 3 Then
            ' コマンドバーにカスタムテキストを設定
            SetCustomText(e)
        End If
    End Sub
End Class

<%@ Page MasterPageFile="~/MasterPage.master" Language="c#" AutoEventWireup="true" 
         Inherits="commandbarstyle" CodeFile="commandbarstyle.aspx.cs" %>

<%@ Register Assembly="FarPoint.Web.SpreadJ" Namespace="FarPoint.Web.Spread" TagPrefix="FarPoint" %>

<asp:Content ID="Content1" ContentPlaceHolderID="ContentPlaceHolder1" runat="server">
    <farpoint:FpSpread ID="FpSpread1" runat="server" 
        onactivesheetchanged="FpSpread1_ActiveSheetChanged" 
        oncreatebutton="FpSpread1_CreateButton">
        <CommandBar BackColor="Control" ButtonFaceColor="Control" ButtonHighlightColor="ControlLightLight"
            ButtonShadowColor="ControlDark" />
        <Sheets>
            <farpoint:SheetView SheetName="Sheet1">
            </farpoint:SheetView>
        </Sheets>
    </farpoint:FpSpread>
</asp:Content>

このページの先頭へ戻る