[英]WPF binding datatemplate
我是一個新的 WPF,我正在做關於 MVVM 的工作。 我的問題如下:首先我有 1 個 ObservableCollection。 這里包含我的信息列表。 我還在 HomeViewModel 中將它設為 Icommand,以便它可以綁定到我在數據模板中的按鈕。
在視圖中,我有一個從 HomeViewModel 獲取數據上下文的 xaml 文件。 而我只能綁定ItemsSou中ObservableCollection或Icommand中的值[在此輸入圖片描述][1]rce。 但我兩者都想要。 也許是因為我的代碼邏輯是錯誤的,但任何人都可以幫助我。
這是我的 ViewModel 的片段:
public class HomeViewModel: BaseViewModel
{
public ICommand AddCommand { get; set; }
public ICommand ChangeHomeBG { get; set; }
public ICommand LookBill { get; set; }
#region Khoi tao
private ObservableCollection<OderModel> oderviewmodel;
public ObservableCollection<OderModel> OderViewModel
{
get
{
if (oderviewmodel == null)
{
oderviewmodel = new ObservableCollection<OderModel>();
}
return oderviewmodel;
}
set
{
oderviewmodel = value;
//OnpropertyChanged(nameof(OderViewModel));
OnPropertyChanged(nameof(OderViewModel));
}
}
public HomeViewModel()
{
//Khởi tạo dữ liệu-vui lòng không làm quá nhiều tác vụ ở đây, bạn có thể sử dụng Tác vụ nếu cần
oderviewmodel = new ObservableCollection<OderModel>();
//oderviewmodel.Add(new OderModel { Name = "Meme", TenBan = "A8" });
for (int i = 0; i < 20; i++)
{
oderviewmodel.Add(new OderModel { ID = "#00234", Status = "Đang phục vụ", SoNguoi = 8, TenBan = "A8", Price = Utils.ConvertMoney("100000"), Time = "3 Giờ 34 phút" });
}
LookBill = new RelayCommand<Window>((p) => { return true; }, (p) => MessageBox.Show("helo br"));
//AddCommand = new DelegateCommand<string>(
// (s) => true,
// (s) => OderViewModel.Add(new OderModel { ID = s})
// );
}
}
這是我的觀點的片段:
<ItemsControl x:Name="OderViewModel" ItemsSource="{Binding OderViewModel}" ScrollBar.Scroll="ItemsControl_Scroll">
<ItemsControl.Template>
<ControlTemplate TargetType="ItemsControl">
<Border>
<ItemsPresenter/>
</Border>
</ControlTemplate>
</ItemsControl.Template>
<ItemsControl.ItemsPanel>
<ItemsPanelTemplate>
<WrapPanel/>
</ItemsPanelTemplate>
</ItemsControl.ItemsPanel>
<ItemsControl.ItemTemplate>
<DataTemplate>
<!--<DataTemplate.Resources>
<Style>
-->
<!--Style in template-->
<!--
</Style>
</DataTemplate.Resources>-->
<Border BorderBrush="White" BorderThickness="1" Margin="15,0,0,15">
<Grid Width="186" Height="150">
<Grid.RowDefinitions>
<RowDefinition Height="30*"/>
<RowDefinition Height="90*"/>
<RowDefinition Height="30*"/>
</Grid.RowDefinitions>
<Grid x:Name="HedearCardHome" Grid.Row="0" Background="{DynamicResource StatusColorHome }">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="53*"/>
<ColumnDefinition Width="90*"/>
<ColumnDefinition Width="43*"/>
</Grid.ColumnDefinitions>
<Grid Grid.Column="0">
<TextBlock Text="{Binding DataContext.ID }"
HorizontalAlignment="Center"
VerticalAlignment="Center"
FontSize="12"
Foreground="White"/>
</Grid>
<Grid Grid.Column="1">
<TextBlock Text="{Binding Status}"
HorizontalAlignment="Center"
VerticalAlignment="Center"
Foreground="White"
FontSize="12"/>
</Grid>
<Grid Grid.Column="2">
<TextBlock Text="{Binding SoNguoi}"
HorizontalAlignment="Center"
VerticalAlignment="Center"
Foreground="White"
FontSize="12" Margin="25,0,0,0"/>
<fa:FontAwesome Icon="User"
HorizontalAlignment="Center"
VerticalAlignment="Center"
FontSize="12"
Foreground="White"/>
</Grid>
</Grid>
<Grid x:Name="ContentHeaderHome" Grid.Row="1" Background="White">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="55"/>
<ColumnDefinition Width="131"/>
</Grid.ColumnDefinitions>
<Grid Grid.Column="0">
<Image Source="{StaticResource Hline}"
HorizontalAlignment="Right"/>
<TextBlock Text="{Binding TenBan}"
HorizontalAlignment="Center"
VerticalAlignment="Center"
FontWeight="Bold"
FontSize="35"
Foreground="{DynamicResource StatusColorHome}"/>
</Grid>
<!--<Border BorderBrush="#F2F1F1" BorderThickness="0.3" >
</Border>-->
<Grid Grid.Column="1">
<Grid.RowDefinitions>
<RowDefinition/>
<RowDefinition/>
<RowDefinition/>
</Grid.RowDefinitions>
<Grid Grid.Row="0" Grid.RowSpan="2">
<Image Source="{DynamicResource Hline}"
VerticalAlignment="Bottom"
HorizontalAlignment="Center">
<Image.LayoutTransform>
<RotateTransform Angle="90"/>
</Image.LayoutTransform>
</Image>
<TextBlock Text="{Binding Price}"
HorizontalAlignment="Center"
VerticalAlignment="Center"
FontSize="26"
FontWeight="Bold"
Foreground="{DynamicResource StatusColorHome}">
</TextBlock>
</Grid>
<Grid Grid.Row="2">
<Grid.ColumnDefinitions>
<ColumnDefinition/>
<ColumnDefinition/>
<ColumnDefinition/>
<ColumnDefinition/>
</Grid.ColumnDefinitions>
<Grid Grid.Column="0">
<fa:FontAwesome Icon="ClockOutline"
HorizontalAlignment="Center"
VerticalAlignment="Center"
Foreground="{DynamicResource GrayTimeHome}"/>
</Grid>
<Grid Grid.Column="1" Grid.ColumnSpan="2">
<TextBlock Text="{Binding Time}"
FontSize="11"
HorizontalAlignment="Center"
VerticalAlignment="Center"
Foreground="{DynamicResource GrayHome1}"/>
</Grid>
<Grid Grid.Column="3">
<fa:FontAwesome Icon="BirthdayCake"
VerticalAlignment="Center"
HorizontalAlignment="Center"
FontSize="12"
Foreground="{DynamicResource StatusColorHome}"/>
</Grid>
</Grid>
</Grid>
</Grid>
<Grid x:Name="FooterHome" Grid.Row="2" Background="{DynamicResource FooterHome}">
<Grid.ColumnDefinitions>
<ColumnDefinition/>
<ColumnDefinition/>
<ColumnDefinition/>
<ColumnDefinition/>
</Grid.ColumnDefinitions>
<Grid Grid.Column="0">
<Button x:Name="btn_HomeBill"
Background="{DynamicResource FooterHome}"
BorderBrush="{x:Null}" Command="{Binding LookBill}">
<Image Source="{StaticResource lookbill}" VerticalAlignment="Center" HorizontalAlignment="Center"/>
</Button>
</Grid>
<Grid Grid.Column="1">
<Button Background="{DynamicResource FooterHome}" BorderBrush="{x:Null}">
<Image Source="{StaticResource iconPrint}" VerticalAlignment="Center" HorizontalAlignment="Center"/>
</Button>
</Grid>
<Grid Grid.Column="2">
<StackPanel>
<Button Background="{DynamicResource FooterHome}"
BorderBrush="{x:Null}"
Command="{Binding Path=DataContext.LookBill}"
CommandParameter="{Binding}"
Margin="0,0,0,-2">
<Image Source="{StaticResource iconMoney}" VerticalAlignment="Center" HorizontalAlignment="Center" >
</Image>
</Button>
</StackPanel>
</Grid>
<!--<Grid Grid.Column="3">
<fa:FontAwesome Icon="EllipsisH"
FontSize="20"
HorizontalAlignment="Center"
VerticalAlignment="Center"
Foreground="{DynamicResource IconFooter}"/>
</Grid>-->
<Grid Grid.Column="3">
<materialDesign:PopupBox Foreground="{DynamicResource IconFooter}" VerticalAlignment="Center" HorizontalAlignment="Center">
<StackPanel>
<Button Content="More"/>
<Button Content="Option"/>
</StackPanel>
</materialDesign:PopupBox>
</Grid>
</Grid>
</Grid>
</Border>
</DataTemplate>
</ItemsControl.ItemTemplate>
</ItemsControl>
這是我想更改的片段:(ItemSource)
<ItemsControl x:Name="OderViewModel" ItemsSource="{Binding OderViewModel}" ScrollBar.Scroll="ItemsControl_Scroll">
在這里為什么我不在按鈕中綁定 Icommand ?
<Grid Grid.Column="0">
<Button x:Name="btn_HomeBill"
Background="{DynamicResource FooterHome}"
BorderBrush="{x:Null}" Command="{Binding LookBill}">
<Image Source="{StaticResource lookbill}" VerticalAlignment="Center" HorizontalAlignment="Center"/>
</Button>
</Grid>
btn_HomeBill
按鈕位於 ItemsControl.ItemTemplate 內。 這意味着它的 DataContext 是OderModel
而不再是HomeViewModel
,您可以在其中訪問LookBill
。
您應該能夠將綁定更改為:
<Button x:Name="btn_HomeBill"
...
Command="{Binding RelativeSource={RelativeSource AncestorType=ItemsControl}, Path=DataContext.LookBill}" />
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.