この手順では、C1LinearGauge コントロールの外観をカスタマイズします。以下の手順では、「手順１/３：ページへの C1LinearGauge の追加」トピックが終了しており、ページに C1LinearGauge コントロールが追加されていることを前提とします。

デザインビューの場合

デザインビューで C1LinearGauge コントロールをカスタマイズするには、以下の手順を実行します。

• 以下の手順を実行して、コントロールの Width と Height を設定します。
• 1. コントロールを右クリックし、［プロパティ］を選択します。
  2. プロパティウィンドウで、Options プロパティを展開します。
  3. コントロールの Width と Height に任意の値を設定します。
• 以下の手順を実行して、コントロールの初期 Value を設定します。
• 1. コントロールを右クリックし、［プロパティ］を選択します。
  2. Behavior プロパティを展開します。
  3. 目的の Value を設定します。
• 以下の手順を実行して、コントロールの Face の外観を変更します。
• 1. コントロールを右クリックし、［プロパティ］を選択します。
  2. ［プロパティ］ウィンドウで、Appearance プロパティを展開します。
  3. Face プロパティを展開します。
  4. FaceStyle プロパティを展開します。
  5. Fill プロパティを展開します。
  6. Color、ColorBegin、ColorEnd、Type などのプロパティを任意に設定して、ゲージの外観を変更します。

ソースビューの場合

ソースビューで C1LinearGauge コントロールをカスタマイズするには、以下の手順を実行します。

• コントロールの Width と Height を設定し、実行時のゲージの初期 Value を設定するには、<cc1:C1LinearGauge></cc1:C1LinearGauge> タグを次のように編集します。

• <cc1:C1LinearGauge ID="C1LinearGauge1" runat="server" Width="400" Height="100" Value="50">
  

• コントロールの Face の外観を変更するには、<cc1:C1LinearGauge></cc1:C1LinearGauge> タグの間にマウスを置き、次のマークアップを追加します。
  

      <Face>
         <FaceStyle Fill-LinearGradientAngle="270" Fill-ColorBegin="pink" Fill-ColorEnd="purple
         Fill-Type="LinearGradient" StrokeWidth="4"></FaceStyle>
      </Face>
  

• 必要に応じて、LinearGradientAngle、ColorBegin、ColorEnd、Type、および StrokeWidth を設定して、C1LinearGauge コントロールの外観をカスタマイズします。
  

コードの場合

Width、Height、Max、Min の各値を設定して C1LinearGauge コントロールの外観をカスタマイズするには、Page_Load イベントに次のコードを追加します。

Visual Basic でコードを書く場合

C# でコードを書く場合

ここまでの成果

アプリケーションを実行して、ゲージが次の図のように表示されることを確認します。