書式設定もできる数値コントロールを持ったWPFアプリケーションの作成

PowerTools InputMan for WPF 1.0JのGcNumberコントロールを使ったアプリケーションの作成

2011/08/15 14:00

ダウンロードサンプルソース（C#） (91.7 KB)
ダウンロードサンプルソース（VB） (94.6 KB)

ページの仕上げとイベント処理

　最後に、残りのコントロールを配置して仕上げ、2つのイベント処理を作成します。1つは、GcNumberコントロールの入力値が0以下になった場合は、入札を受け付けないようにButtonコントロールを無効にします。

Visual Basic

Imports GrapeCity.Windows.InputMan

Class MainWindow

    Private Sub GcNumber1_ValueChanged(ByVal sender As System.Object, ByVal e As System.Windows.RoutedEventArgs)
        If Me.GcNumber1.Value <= 0 Then
            Me.Button1.IsEnabled = False
        Else
            Me.Button1.IsEnabled = True
        End If
    End Sub

using GrapeCity.Windows.InputMan;
namespace WpfApp_GcNumber_cs
{
    public partial class MainWindow : Window
    {
        private void GcNumber1_ValueChanged(object sender, RoutedEventArgs e)
        {
            if (GcNumber1.Value <= 0)
            {
                Button1.IsEnabled = false;
            }
            else
            {
                Button1.IsEnabled = true;
            }
        }

　もう1つは、入札金額をTextBlockに反映させる処理です。これは、メッセージボックスで確認を取ってから実行します。

Visual Basic

    Private Sub Button1_Click(ByVal sender As System.Object, ByVal e As System.Windows.RoutedEventArgs)
        Dim ret As MessageBoxResult

        ret = MessageBox.Show("この金額で入札を受け付けます。", "入札確認", MessageBoxButton.OKCancel, MessageBoxImage.Question)
        If ret = MessageBoxResult.OK Then
            Me.TextBlock4.Text = "現在価格：" + Me.GcNumber1.Value.ToString() + "円"
        End If

    End Sub
End Class

        private void Button1_Click(object sender, RoutedEventArgs e)
        {
            MessageBoxResult ret; 
            ret = MessageBox.Show("この金額で入札を受け付けます。", "入札確認", MessageBoxButton.OKCancel, MessageBoxImage.Question);
            if(ret == MessageBoxResult.OK)
            {
                TextBlock4.Text = "現在価格：" + GcNumber1.Value.ToString() + "円";
            }
        }
    }
}

　以上で、できあがりです。

完成したXAML全文

<Grid Height="335" Width="573">
    <my:GcNumber Name="GcNumber1" Margin="0,276,155,33" Value="100" SpinIncrement="100" MaxValue="100000000" 
                 MinValue="-1000" HorizontalAlignment="Right" Background="{x:Null}" 
                 Width="203" WatermarkZero="" 
                 AllowDropDownOpen="True" DropDownButtonVisibility="ShowAlways"
                 ValueChanged="GcNumber1_ValueChanged" UseLayoutRounding="True">
        <im:GcNumber.FieldSet>
            <im:NumberFieldSet>
                <im:NumberFieldSet.DecimalPart>
                    <im:NumberDecimalPartField MaxDigits="0" />
                </im:NumberFieldSet.DecimalPart>
                <im:NumberFieldSet.DecimalSeparator>
                    <im:NumberDecimalSeparatorField />
                </im:NumberFieldSet.DecimalSeparator>
                <im:NumberFieldSet.IntegerPart>
                    <im:NumberIntegerPartField MaxDigits="9" MinDigits="0">
                        <im:NumberIntegerPartField.GroupSizes>
                            <im:IntegerItem Value="3" />
                        </im:NumberIntegerPartField.GroupSizes>
                    </im:NumberIntegerPartField>
                </im:NumberFieldSet.IntegerPart>
                <im:NumberFieldSet.SignPrefix>
                    <im:NumberSignPrefixField NegativePattern="金額エラー -" PositivePattern="入札価格：   " Foreground="Chocolate" HorizontalAlignment="Left" />
                </im:NumberFieldSet.SignPrefix>
                <im:NumberFieldSet.SignSuffix>
                    <im:NumberSignSuffixField NegativePattern="" PositivePattern=" 円（税込）" Foreground="Chocolate" />
                </im:NumberFieldSet.SignSuffix>
            </im:NumberFieldSet>
        </im:GcNumber.FieldSet>

    </my:GcNumber>
    <Image Height="122" HorizontalAlignment="Left" Margin="51,148,0,0" Name="Image1" Stretch="Fill" VerticalAlignment="Top" Width="153" Source="/WpfApplication1;component/Images/flower.jpg" />
    <TextBlock Height="24" HorizontalAlignment="Right" Margin="0,118,84,0" Name="TextBlock1" Text="激レア！ 2011年新作 一品限り 雪割草" VerticalAlignment="Top" Width="438" TextWrapping="Wrap" Foreground="#FF2D56DB" FontStyle="Normal" FontSize="16" FontFamily="MS Gothic" FontWeight="Bold" />
    <TextBlock Height="18" HorizontalAlignment="Left" Margin="226,195,0,0" Name="TextBlock2" Text="開始価格：100円" VerticalAlignment="Top" Width="106" />
    <TextBlock Height="18" HorizontalAlignment="Left" Margin="226,219,0,0" Name="TextBlock3" Text="入札単価：100円" VerticalAlignment="Top" Width="106" />
    <Button Content="入札する" Height="26" HorizontalAlignment="Left" Margin="430,276,0,0" Name="Button1" VerticalAlignment="Top" Width="119" Click="Button1_Click"/>
    <Image Height="73" HorizontalAlignment="Left" Margin="104,22,0,0" Name="Image2" Stretch="Fill" VerticalAlignment="Top" Width="284" OpacityMask="{x:Null}" Source="/WpfApplication1;component/Images/logo.jpg" />
    <TextBlock Height="18" HorizontalAlignment="Left" Margin="226,243,0,0" Name="TextBlock4" Text="現在価格：100円" VerticalAlignment="Top" Width="106" />
    <TextBlock Height="41" HorizontalAlignment="Right" Margin="0,148,112,0" Name="TextBlock5" Text="めったにお目にかかれない逸品！今回を逃したら二度と手に入りません。" TextWrapping="Wrap" VerticalAlignment="Top" Width="235" />
    <TextBlock Height="18" HorizontalAlignment="Left" Margin="355,195,0,0" Name="TextBlock6" Text="出品数：１" VerticalAlignment="Top" Width="106" />
    <TextBlock Height="18" HorizontalAlignment="Left" Margin="355,219,0,0" Name="TextBlock7" Text="開始日時：2011年8月5日 18:21 " VerticalAlignment="Top" Width="183" />
    <TextBlock Height="18" HorizontalAlignment="Left" Margin="355,243,0,0" Name="TextBlock8" Text="終了日時：2011年8月10日 23:59 " VerticalAlignment="Top" Width="194" />
    <Grid.Background>
        <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
            <GradientStop Color="#FF00E100" Offset="0" />
            <GradientStop Color="#FFB4FFFF" Offset="1" />
        </LinearGradientBrush>
    </Grid.Background>
</Grid>

まとめ

　GcNumberコントロールは、WPFアプリケーションにボタンで数値を入力できるインターフェイスを提供します。このコントロールは、単純に数値を入力できるだけでなく、数値に書式も設定でき、バラエティに富んだ外観を作成できます。これらの設定は、いずれもプロパティウィンドウを使って作成できるため、XAMLの記述方法を知らなくても簡単に設定できるようになっています。プログラミングの知識のないWebデザイナーでもコントロールを作成できるのは、とても嬉しい機能ですね。

　よりユーザーフレンドリーなWPFアプリケーションの作成を考えている方には、お勧めのコントロールです。

参考文献

Microsoft MSDNライブラリ：Windows Presentation Foundation

この記事は参考になりましたか？

印刷用を表示

ComponentZine（InputMan）連載記事一覧: JavaScript入力コントロール「InputManJS」に待望のリッチテキストエディタ...

JavaScript入力コントロール「InputManJS」にBootstrapを組み合わ...

便利な入力部品が多数追加！ JavaScript入力コントロール「InputManJS」最...

もっと読む

この記事の著者: 瀬戸遥（セトハルカ）

8ビットコンピュータの時代からBASICを使い、C言語を独習で学びWindows 3.1のフリーソフトを作成、NiftyServeのフォーラムなどで配布。Excel VBAとVisual Basic関連の解説書を中心に現在まで40冊以上の書籍を出版。近著に、「ExcelユーザーのためのAccess再...

※プロフィールは、執筆時点、または直近の記事の寄稿時点での内容です

この著者の最近の執筆記事