デモアプリケーショントップ
ナビゲーション リンクのスキップ
 新機能 の展開 新機能
 InputMan連携 の展開 InputMan連携
 マルチタッチ機能 の展開 マルチタッチ機能
 セル、行、列、ヘッダ の展開 セル、行、列、ヘッダ
 シート の展開 シート
 スタイル の縮小 スタイル
 選択 の展開 選択
 セル型 の展開 セル型
 編集 の展開 編集
 ソート の展開 ソート
 フィルタリング の展開 フィルタリング
 グループ化 の展開 グループ化
 ページング の展開 ページング
 スクロール の展開 スクロール
 データ連結 の展開 データ連結
 階層表示 の展開 階層表示
 コマンドバー の展開 コマンドバー
 チャート の展開 チャート
 数式 の展開 数式
 インポート／エクスポート の展開 インポート／エクスポート
 クライアント側スクリプト の展開 クライアント側スクリプト

編集中セルのスタイル

セル型クラスのEditorCssClassにより、編集中セルの外観（フォントや色など）を設定できます。
編集可能な通貨、日付時刻、倍精度、標準、整数、パーセント、マスク、テキスト型セルで設定することができます。
 AB
1通貨¥1,234
2日付時刻2024/11/21
3倍精度1234.5
4標準標準
5整数12
6パーセント12%
7マスク123-45-6789
8テキストテキスト
   

ソースコード

別ウィンドウで表示 
using System;
using System.Web.UI.WebControls;

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

        // SPREADの設定
        InitSpread(FpSpread1);

        // シート設定
        InitSpreadStyles(FpSpread1.Sheets[0]);
    }

    private void InitSpread(FarPoint.Web.Spread.FpSpread spread)
    {
        spread.CssClass = "spreadStyle";
        spread.UseClipboard = false;
    }

    private void InitSpreadStyles(FarPoint.Web.Spread.SheetView sheet)
    {
        // フォントの設定
        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].Font.Size = FontUnit.Parse("80%");
        
        // 行列数の設定
        sheet.ColumnCount = 2;
        sheet.RowCount = 8;

        // 列幅の設定
        sheet.Columns[0].Width = 145;
        sheet.Columns[1].Width = 145;

        // 行の高さの設定
        sheet.Rows.Default.Height = 26;

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

        // セル型の設定
        sheet.SetClip(0, 0, 8, 1, "通貨\n" + "日付時刻\n" + "倍精度\n" + "標準\n" + "整数\n" + "パーセント\n" + "マスク\n" + "テキスト");

        FarPoint.Web.Spread.CurrencyCellType currcell = new FarPoint.Web.Spread.CurrencyCellType();
        currcell.EditorCssClass = "CurrencyStyle1";
        sheet.Cells[0, 1].CellType = currcell;
        sheet.Cells[0, 1].Value = 1234;

        FarPoint.Web.Spread.DateTimeCellType datecell = new FarPoint.Web.Spread.DateTimeCellType();
        datecell.EditorCssClass = "DateTimeStyle1";
        sheet.Cells[1, 1].CellType = datecell;
        sheet.Cells[1, 1].Value = DateTime.Now.ToShortDateString();

        FarPoint.Web.Spread.DoubleCellType dblcell = new FarPoint.Web.Spread.DoubleCellType();
        dblcell.EditorCssClass = "DoubleStyle1";
        sheet.Cells[2, 1].CellType = dblcell;
        sheet.Cells[2, 1].Value = 1234.5d;

        FarPoint.Web.Spread.GeneralCellType gencell = new FarPoint.Web.Spread.GeneralCellType();
        gencell.EditorCssClass = "GeneralStyle1";
        sheet.Cells[3, 1].CellType = gencell;
        sheet.Cells[3, 1].Value = "標準";

        FarPoint.Web.Spread.IntegerCellType intcell = new FarPoint.Web.Spread.IntegerCellType();
        intcell.EditorCssClass = "IntegerStyle1";
        sheet.Cells[4, 1].CellType = intcell;
        sheet.Cells[4, 1].Value = 12;

        FarPoint.Web.Spread.PercentCellType pctcell = new FarPoint.Web.Spread.PercentCellType();
        pctcell.EditorCssClass = "PercentStyle1";
        sheet.Cells[5, 1].CellType = pctcell;
        sheet.Cells[5, 1].Value = 0.12;

        FarPoint.Web.Spread.RegExpCellType rgex = new FarPoint.Web.Spread.RegExpCellType();
        rgex.ValidationExpression = "^\\d{3}-\\d{2}-\\d{4}$";
        rgex.ErrorMessage = "SSN (ex, 123-45-6789)";
        rgex.EditorCssClass = "RegExpStyle1";
        sheet.Cells[6, 1].CellType = rgex;
        sheet.Cells[6, 1].Value = "123-45-6789";

        FarPoint.Web.Spread.TextCellType tcell = new FarPoint.Web.Spread.TextCellType();
        tcell.EditorCssClass = "TextStyle1";
        sheet.Cells[7, 1].CellType = tcell;
        sheet.Cells[7, 1].Value = "テキスト";

        // 1列目をロック
        sheet.Columns[0].Locked = true;
        sheet.LockBackColor = System.Drawing.Color.FromArgb(184, 184, 184);
    }
}


Partial Class style_editorcssclass
    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

        ' SPREADの設定
        InitSpread(FpSpread1)

        ' シート設定
        InitSpreadStyles(FpSpread1.Sheets(0))
    End Sub

    Private Sub InitSpread(ByVal spread As FarPoint.Web.Spread.FpSpread)
        spread.CssClass = "spreadStyle"
        spread.UseClipboard = False
    End Sub

    Private Sub InitSpreadStyles(ByVal sheet As FarPoint.Web.Spread.SheetView)
        ' フォントの設定
        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).Font.Size = FontUnit.Parse("80%")

        ' 行列数の設定
        sheet.ColumnCount = 2
        sheet.RowCount = 8

        ' 列幅の設定
        sheet.Columns(0).Width = 145
        sheet.Columns(1).Width = 145

        ' 行の高さの設定
        sheet.Rows.[Default].Height = 26

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

        ' セル型の設定
        sheet.SetClip(0, 0, 8, 1, "通貨" & vbLf & "日付時刻" & vbLf & "倍精度" & vbLf & "標準" & vbLf & "整数" & vbLf & "パーセント" & vbLf & "マスク" & vbLf & "テキスト")

        Dim currcell As New FarPoint.Web.Spread.CurrencyCellType()
        currcell.EditorCssClass = "CurrencyStyle1"
        sheet.Cells(0, 1).CellType = currcell
        sheet.Cells(0, 1).Value = 1234

        Dim datecell As New FarPoint.Web.Spread.DateTimeCellType()
        datecell.EditorCssClass = "DateTimeStyle1"
        sheet.Cells(1, 1).CellType = datecell
        sheet.Cells(1, 1).Value = DateTime.Now.ToShortDateString()

        Dim dblcell As New FarPoint.Web.Spread.DoubleCellType()
        dblcell.EditorCssClass = "DoubleStyle1"
        sheet.Cells(2, 1).CellType = dblcell
        sheet.Cells(2, 1).Value = 1234.5

        Dim gencell As New FarPoint.Web.Spread.GeneralCellType()
        gencell.EditorCssClass = "GeneralStyle1"
        sheet.Cells(3, 1).CellType = gencell
        sheet.Cells(3, 1).Value = "標準"

        Dim intcell As New FarPoint.Web.Spread.IntegerCellType()
        intcell.EditorCssClass = "IntegerStyle1"
        sheet.Cells(4, 1).CellType = intcell
        sheet.Cells(4, 1).Value = 12

        Dim pctcell As New FarPoint.Web.Spread.PercentCellType()
        pctcell.EditorCssClass = "PercentStyle1"
        sheet.Cells(5, 1).CellType = pctcell
        sheet.Cells(5, 1).Value = 0.12

        Dim rgex As New FarPoint.Web.Spread.RegExpCellType()
        rgex.ValidationExpression = "^\d{3}-\d{2}-\d{4}$"
        rgex.ErrorMessage = "SSN (ex, 123-45-6789)"
        rgex.EditorCssClass = "RegExpStyle1"
        sheet.Cells(6, 1).CellType = rgex
        sheet.Cells(6, 1).Value = "123-45-6789"

        Dim tcell As New FarPoint.Web.Spread.TextCellType()
        tcell.EditorCssClass = "TextStyle1"
        sheet.Cells(7, 1).CellType = tcell
        sheet.Cells(7, 1).Value = "テキスト"

        ' 1列目をロック
        sheet.Columns(0).Locked = True
        sheet.LockBackColor = System.Drawing.Color.FromArgb(184, 184, 184)
    End Sub
End Class

<%@ Page Title="" Language="C#" MasterPageFile="~/MasterPage.master" AutoEventWireup="true"
  CodeFile="editorcssclass.aspx.cs" Inherits="style_editorcssclass" %>

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

<asp:Content ID="Content1" ContentPlaceHolderID="HeaderPlaceHolder1" runat="Server">
  <style type="text/css">
    .CurrencyStyle1
    {
      text-align: right;
      font: bold large "cursive";
      color: #FF0000 !important;
      background-color: #FFFF00 !important;
    }
    .DateTimeStyle1
    {
      text-align: right;
      font: bold large "cursive";
      color: #FF0000 !important;
      background-color: #33FFFF !important;
    }
    .DoubleStyle1
    {
      text-align: right;
      font: bold large "cursive";
      color: #FF0000 !important;
      background-color: #FF9900 !important;
    }
    .GeneralStyle1
    {
      text-align: right;
      font: bold large "cursive";
      color: #FF0000 !important;
      background-color: #00FF99 !important;
    }
    .IntegerStyle1
    {
      text-align: right;
      font: bold large "cursive";
      color: #FF0000 !important;
      background-color: #CC33FF !important;
    }
    .PercentStyle1
    {
      text-align: right;
      font: bold large "cursive";
      color: #FF0000 !important;
      background-color: #CCCC00 !important;
    }
    .RegExpStyle1
    {
      text-align: right;
      font: bold large "cursive";
      color: #FF0000 !important;
      background-color: #FFCCFF !important;
    }
    .TextStyle1
    {
      text-align: center;
      font: bold large "cursive";
      color: #FF0000 !important;
      background-color: #0000FF !important;
    }
  </style>
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" runat="Server">
    <FarPoint:FpSpread ID="FpSpread1" runat="server" BorderColor="#A0A0A0" BorderStyle="Solid"
        BorderWidth="1px">
        <CommandBar BackColor="#F6F6F6" ButtonFaceColor="Control" ButtonHighlightColor="ControlLightLight"
            ButtonShadowColor="ControlDark">
        </CommandBar>
        <Sheets>
            <FarPoint:SheetView SheetName="Sheet1">
            </FarPoint:SheetView>
        </Sheets>
    </FarPoint:FpSpread>
</asp:Content>