0

電卓のようなインターフェイスを設計する必要があります。私はこれを行う方法について完全に混乱しています.誰かが私に洞察を提供できますか? 実行時にこれらのボタンでデータをバインドする方法。

4

1 に答える 1

1

これでうまくいきました - 基本的に、次の XAML レイアウトと次のバインディングを作成しました。

<Grid x:Name="grdItems">
        <Grid.ColumnDefinitions>
            <ColumnDefinition></ColumnDefinition>
            <ColumnDefinition></ColumnDefinition>
            <ColumnDefinition></ColumnDefinition>
        </Grid.ColumnDefinitions>
        <Grid.RowDefinitions>
            <RowDefinition></RowDefinition>
            <RowDefinition></RowDefinition>
            <RowDefinition></RowDefinition>
            <RowDefinition></RowDefinition>
        </Grid.RowDefinitions>

        <Button Content="{Binding Items[0].ItemName}"></Button>
        <Button Content="{Binding Items[1].ItemName}" Grid.Column="1"></Button>
        <Button Content="{Binding Items[2].ItemName}" Grid.Column="2"></Button>
        <Button Content="{Binding Items[3].ItemName}" Grid.Row="1"></Button>
        <Button Content="{Binding Items[4].ItemName}" Grid.Row="1" Grid.Column="1"></Button>
        <Button Content="{Binding Items[5].ItemName}" Grid.Row="1" Grid.Column="2"></Button>
        <Button Content="{Binding Items[6].ItemName}" Grid.Row="2"></Button>
        <Button Content="{Binding Items[7].ItemName}" Grid.Row="2" Grid.Column="1"></Button>
        <Button Content="{Binding Items[8].ItemName}" Grid.Row="2" Grid.Column="2"></Button>
        <Button Content="Prev" Command="{Binding MovePrevCommand}" Grid.Row="3"></Button>
        <Button Content="{Binding Items[9].ItemName}" Grid.Row="3" Grid.Column="1"></Button>
        <Button Content="Next" Command="{Binding MoveNextCommand}" Grid.Row="3" Grid.Column="2"></Button>
    </Grid>

これにより、グリッドレイアウトが得られます

次に、「ウィンドウ ビュー」を実行するコレクション マネージャー クラスを作成しました。

class TestCollection
{
    public ObservableCollection<TestItem> Items { get; set; }

    List<TestItem> _items = new List<TestItem>();
    int pos = 0;

    public TestCollection(int size)
    {
        MoveNextCommand = new Command(new Action(MoveNext));
        MovePrevCommand = new Command(new Action(MovePrev));


        Items = new ObservableCollection<TestItem>();
        for (int i = 0; i < size; i++)
        {
            _items.Add(new TestItem("Item " + i.ToString()));
        }

        UpdateItems();
    }

    public void MoveNext()
    {
        pos += 10;

        if (pos > _items.Count - 10)
            pos = _items.Count - 10;

        UpdateItems();
    }

    public ICommand MoveNextCommand { get; set; }
    public ICommand MovePrevCommand { get; set; }

    public void MovePrev()
    {
        pos -= 10;

        if (pos < 0)
            pos = 0;

        UpdateItems();
    }

    private void UpdateItems()
    {
        Items.Clear();

        foreach (var i in _items.Skip(pos).Take(10))
        {
            Items.Add(i);
        }

   }

}

デリゲートを呼び出す ICommand の簡単な実装を作成しました。

class Command : ICommand
{
    Action CallBack = null;

    public Command(Action cb)
    {
        CallBack = cb;
    }

    public bool CanExecute(object parameter)
    {
        return true;
    }

    public event EventHandler CanExecuteChanged;

    public void Execute(object parameter)
    {
        CallBack();
    }
}

TestItem は、ItemName プロパティを持つ単純なクラスです。

class TestItem
{
    public string ItemName { get; set; }

    public TestItem(string itemName)
    {
        ItemName = itemName;
    }
}

次に、追加したメインアプリコードで

 var i = new TestCollection(2000);

 grdItems.DataContext = i;

コレクションをグリッドに配線します。かなりうまく機能します-ボタンを押すと、アイテムにコマンドバインディングを追加して、目的の効果を得ることができます（もちろん、各アイテムにボタンが必要であると仮定します！）

それがあなたが始めるのに役立つかどうか、またはあなたが理解していないことがあれば教えてください (または、これが Metro でも機能するかどうか!!)

編集:読んだだけで、IObservableVector が WinRT の ObservableCollection に置き換わったようです

これは 2012 年 1 月だったので、それ以降の更新で ObservableVector の実装が追加された可能性がありますが、この記事からは実装する必要があるようです。

http://blogs.u2u.be/diederik/post/2012/01/03/Hello-ObservableVector-goodbye-ObservableCollection.aspx

コードはとにかくそこにあるので、頭脳の力は必要ありません!

于 2012-06-25T13:26:47.673 に答える