SuperTooltip for WinForms
カスケードスタイルの使用
SuperTooltipの操作 > カスケードスタイルの使用

The following topic explains how to apply a cascading style sheet to your ToolTips for complete control over how and where they appear within your application. SuperTooltip for WinForms supports most HTML features, including cascading style sheets, which offer you greater control over how and where ToolTips appear in your applications. Simply create a cascading style sheet within your code, create your ToolTip, and apply the style sheet styles to the ToolTip.

In the following example, we will create a Microsoft Vista-style ToolTip identical to the one created using the C1SuperTooltip Editor in the Creating C1SuperTooltips at Design Time topic, only this ToolTip will be created in code and use a cascading style sheet. The code in the following steps was placed within the Form_Load event.

  1. Create the cascading style sheet.

    Visual Basic コードの書き方

    Visual Basic
    コードのコピー
    Dim myCSS As String

    'カスケードスタイルシートを作成します。
    myCSS = "<style type='text/css'>" + _
    ".header{font-family: tahoma; font-weight: bold; margin-left: 2px; vertical-align:middle}" + _
    ".body{font-family: tahoma; margin-left: 8px}" + _
    "img{vertical-align: middle}" + _
    "td{vertical-align:middle}" + _
    "p{border-bottom: medium solid #999999; border-bottom-width:1px}" + _
    "</style>"

    C# コードの書き方

    C#
    コードのコピー
    string myCSS;

    //カスケードスタイルシートを作成します。
    myCSS = "<style type='text/css'>" +
    ".header{font-family: tahoma; font-weight: bold; margin-left: 2px; vertical-align:middle}" +
    ".body{font-family: tahoma; margin-left: 8px}" +
    "img{vertical-align: middle}" +
    "td{vertical-align:middle}" +
    "p{border-bottom: medium solid #999999; border-bottom-width:1px}" +
    "</style>";
  2. Create the header and body text of the ToolTip, and apply styles from the cascading style sheet.

    Visual Basic コードの書き方

    Visual Basic
    コードのコピー
    Dim TipBuilder, TipBody, TipHeader As String

    ' ツールチップのヘッダまたはタイトルを作成します。
    TipHeader = "<div class='header'>" + "Copy" + "</div>"
    'ツールチップの本文を作成します。
    TipBody = "<table width=160px>" + _
    "<tr>" + _
    "<td>" + _
    "<div class='body'>" + "Copy the selection and put" + - -
    "it<br>on the Clipboard." + "</div>" + _
    "</td>" + _
    "</tr>" + _
    "</table>" + _
    "<p></p>" + _
    "<table cellpadding=0>" + _
    "<tr>" + _
    "<td>" + _
    "<img src='HelpButton.png'>" + _
    "</td>" + _
    "<td>" + _
    "<div class='header'>" + _
    "Press F1 for help." + _
    "</div>" + _
    "</tr>" + _
    "</table>"

    C# コードの書き方

    C#
    コードのコピー
    string TipBuilder, TipBody, TipHeader;

    // ツールチップのヘッダまたはタイトルを作成します。
    TipHeader = "<div class='header'>" + "Copy" + "</div>";
    //ツールチップの本文を作成します。
    TipBody = "<table width=160px>" +
    "<tr>" +
    "<td>" +
    "<div class='body'>" + "Copy the selection and put" +--
    "it<br>on the Clipboard." + "</div>" +
    "</td>" +
    "</tr>" +
    "</table>" +
    "<p></p>" +
    "<table cellpadding=0>" +
    "<tr>" +
    "<td>" +
    "<img src='HelpButton.png'>" +
    "</td>" +
    "<td>" +
    "<div class='header'>" +
    "Press F1 for help." +
    "</div>" +
    "</tr>" +
    "</table>";
    Note: In this example an embedded resource containing an image is used. To embed a resource, select Project | YourProjectName Properties. Select Add Resource and choose to add an existing file, HelpButton.png in this example, or add a new one. Then, in the Solution Explorer, select the resource file and set Build Action to Embedded Resource in the Properties window.
  3. Combine the separate parts of the ToolTip, and apply the cascading style sheet.

    Visual Basic コードの書き方

    Visual Basic
    コードのコピー
    ' ツールチップのヘッダと本文を組み合わせて、カスケードスタイルシートを適用します。
    TipBuilder = myCSS + TipHeader + TipBody

    C# コードの書き方

    C#
    コードのコピー
    // ツールチップのヘッダと本文を組み合わせて、カスケードスタイルシートを適用します。
    TipBuilder = myCSS + TipHeader + TipBody;
  4. Add the Vista formatting and associate the ToolTip with the button control.

    Visual Basic コードの書き方

    Visual Basic
    コードのコピー
    ' Vistaの背景グラデーションを適用し、ツールチップをButton1に関連付けます。
    C1SuperTooltip1.BackgroundGradient = C1.Win.C1SuperTooltip.BackgroundGradient.Vista
    C1SuperTooltip1.SetToolTip(Button1, TipBuilder)

    C# コードの書き方

    C#
    コードのコピー
    // Vistaの背景グラデーションを適用し、ツールチップをButton1に関連付けます。
    c1SuperTooltip1.BackgroundGradient = C1.Win.C1SuperTooltip.BackgroundGradient.Vista;
    c1SuperTooltip1.SetToolTip(button1, TipBuilder);
  5. Run the project and mouse over the button associated with C1SuperTooltip1. The Vista-style ToolTip appears.
    Supertooltip

 

 

Copyright © GrapeCity, Inc. All rights reserved.