The problem that I'm facing is I want everytime user enter the item code all related details insert in a new stackpanel. that's means every item added will added a new stackpanel. 1 stackpanel will have 1 item. but I couldn't get how to do it that way.
this is the code behind when user key in barcode and press 'Enter'
private void txtItemCode_KeyDown(object sender, KeyEventArgs e)
{
try
{
string itemCode = txtItemCode.Text;
StackPanel spItemDisplay = new StackPanel();
spItemDisplay.Orientation = Orientation.Horizontal;
if (e.Key == Key.Return)
{
spItemDisplay.Children.Add(spItemDisplay);
SimpleItem item = cashierViewModel.validateItemOnHandCode(txtItemCode.Text, 1);
if (item != null)
{
cashierViewModel.AddItemToList(item, PosWindows2.cashier.ShopId);
LoadData();
dgItemDisplay.ItemsSource = null;
dgItemDisplay.ItemsSource = CashierViewModel.itemDisplayList;
}
else
{
MessageBox.Show("Item Not Available.", "Alert", MessageBoxButton.OK, MessageBoxImage.Information);
}
txtItemCode.Text = null;
}
}
this is at .xaml
<StackPanel x:Name="spItemDisplay" >
<ScrollViewer HorizontalAlignment="Right" >
<DataGrid CellEditEnding="DgItemDisplay_CellEditEnding" HorizontalAlignment="Center" Width="1036" Name="dgItemDisplay" AutoGenerateColumns="False" Height="auto" >
<DataGrid.Columns>
<DataGridTextColumn IsReadOnly="True" x:Name="dgItemCode" Width="200" Header="Barcode" Binding="{Binding ItemCode}" />
<DataGridTextColumn IsReadOnly="True" x:Name="dgItemName" Width="350" Header="Item Name" Binding="{Binding ItemName}" />
<DataGridTextColumn IsReadOnly="True" x:Name="dgItemPrice" Width="150" Header="Item Price" Binding="{Binding ItemPrice}" />
<DataGridTextColumn x:Name="dgQuantity" Width="150" Header="Quantity" Binding="{Binding Quantity, UpdateSourceTrigger=PropertyChanged}" />
<DataGridTextColumn x:Name="dgDiscount" Width="150" Header="Discount" Binding="{Binding Discount, UpdateSourceTrigger=PropertyChanged}" />
</DataGrid.Columns>
<DataGrid.RowDetailsTemplate>
<DataTemplate >
<StackPanel Name="spItem" HorizontalAlignment="Center" >
<Grid Margin="0,10" >
<Grid.ColumnDefinitions>
<ColumnDefinition Width="300" />
<ColumnDefinition Width="300" />
<ColumnDefinition Width="100" />
<ColumnDefinition Width="100" />
<ColumnDefinition Width="*" />
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition Height="Auto" />
<RowDefinition Height="Auto" />
</Grid.RowDefinitions>
<TextBlock Text="Quantity: " FontWeight="Bold" Grid.Column="2" Grid.Row="0"/>
<TextBox x:Name="txtQty" Text="{Binding Quantity, UpdateSourceTrigger=PropertyChanged}" Grid.Column="3" Grid.Row="0"/>
<TextBlock Text="Discount: " FontWeight="Bold" Grid.Column="2" Grid.Row="1"/>
<TextBox x:Name="txtDisc" Text="{Binding Discount, UpdateSourceTrigger=PropertyChanged}" Grid.Column="3" Grid.Row="1"/>
</Grid>
</StackPanel>
</DataTemplate>
</DataGrid.RowDetailsTemplate>
</DataGrid>
</ScrollViewer>
</StackPanel>
can anybody help ? I really need your help. Thank you :)
Can't you go for an ItemsControl/ListView, that has an StackPanel(for spItemDisplay) as an ItemsPanelTemplate and specify the DataTemplate as your StackPanel (spItem)?
Something along these lines:
<ItemsControl ItemsSource="{Binding DisplayItems}">
<ItemsControl.ItemsPanel>
<ItemsPanelTemplate>
<StackPanel Orientation="Vertical"/>
</ItemsPanelTemplate>
</ItemsControl.ItemsPanel>
<ItemsControl.ItemTemplate>
<DataTemplate>
<StackPanel x:Name="spItem">
<Grid Margin="0,10">
<Grid.ColumnDefinitions>
<ColumnDefinition/>
<ColumnDefinition/>
<ColumnDefinition/>
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition/>
<RowDefinition/>
</Grid.RowDefinitions>
<TextBlock Text="Quantity: "/>
<TextBlock Text="{Binding Quantity}"/>
<TextBlock/>
</Grid>
</StackPanel>
</DataTemplate>
</ItemsControl.ItemTemplate>
</ItemsControl>
UPDATE:
If you're not familiar with DataTemplates please have a look at Andy's link in the comments or have a look at the following example.
Items Control + DataTemplate explained
Related
I have create simple drag drop in WPF. In my application there are two Listviews. I have to drag list items from first listview and drop the item to second listview. I have created custom data template for first listview. When i drag the first listview item into second listview the data template is not customized so items are not displayed. How to display the list items with generic. Please help. My Code is as below,
<Grid Margin="0,20,0,0">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*" />
<ColumnDefinition Width="Auto" />
</Grid.ColumnDefinitions>
<ListBox
Name="memberCollection"
Grid.Column="1"
Width="150"
HorizontalAlignment="Stretch"
VerticalAlignment="Stretch"
PreviewMouseLeftButtonDown="memberCollection_PreviewMouseLeftButtonDown">
<ListBox.ItemTemplate>
<DataTemplate>
<StackPanel>
<TextBox Text="{Binding Name}" />
</StackPanel>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
<Grid
Name="gridDrop"
Grid.Column="0"
Margin="20,0,0,0"
HorizontalAlignment="Stretch"
VerticalAlignment="Stretch"
ListBox.Drop="grid_Drop"
ShowGridLines="True">
<ListBox
Grid.Row="0"
Grid.Column="0"
Margin="10,10,0,0"
AllowDrop="True" />
</Grid>
</Grid>
Code Behind
ObservableCollection<Member> member = new ObservableCollection<Member>();
public MainWindow()
{
InitializeComponent();
member.Add(new Member { Name = "Karthick", ID = "20011", Address = "10, MainRoad, Chennai" });
memberCollection.ItemsSource = member;
DataContext = new Member();
}
private void memberCollection_PreviewMouseLeftButtonDown(object sender, MouseButtonEventArgs e)
{
object selectedMember = memberCollection.SelectedItem as Member;
if (selectedMember != null)
DragDrop.DoDragDrop(memberCollection, selectedMember, DragDropEffects.All);
}
private void grid_Drop(object sender, RoutedEventArgs e)
{
ListBox listContent = e.Source as ListBox;
if (listContent != null)
Console.WriteLine("", Grid.GetColumn(listContent), Grid.GetRow(listContent));
DataObject item = (((DragEventArgs)e).Data) as DataObject;
object Target = ((Grid)(sender)).DataContext;
object listItem = item.GetData(Target.GetType());
if (listItem != null)
{
//listContent.Items.Add(listItem.Name.ToString());
//listContent.Items.Add(listItem.ID.ToString());
//listContent.Items.Add(listItem.Address.ToString());
//listContent.ItemTemplate = memberCollection.ItemTemplate;
listContent.Items.Add(listItem);
}
}
If you define the DataTemplate as a reusable resource, you can use it in both ListBoxes:
<Grid Margin="0,20,0,0">
<Grid.Resources>
<DataTemplate x:Key="dataTemplate">
<StackPanel>
<TextBox Text="{Binding Name}" />
</StackPanel>
</DataTemplate>
</Grid.Resources>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*" />
<ColumnDefinition Width="Auto" />
</Grid.ColumnDefinitions>
<ListBox
Name="memberCollection"
Grid.Column="1"
Width="150"
HorizontalAlignment="Stretch"
VerticalAlignment="Stretch"
PreviewMouseLeftButtonDown="memberCollection_PreviewMouseLeftButtonDown"
ItemTemplate="{StaticResource dataTemplate}" />
<Grid
Name="gridDrop"
Grid.Column="0"
Margin="20,0,0,0"
HorizontalAlignment="Stretch"
VerticalAlignment="Stretch"
ListBox.Drop="grid_Drop"
ShowGridLines="True">
<ListBox
Grid.Row="0"
Grid.Column="0"
Margin="10,10,0,0"
AllowDrop="True"
ItemTemplate="{StaticResource dataTemplate}"/>
</Grid>
</Grid>
If you want to display some other properties of the dropped Member in the second ListBox, you should define another ItemTemplate:
<ListBox
Grid.Row="0"
Grid.Column="0"
Margin="10,10,0,0"
AllowDrop="True">
<ListBox.ItemTemplate>
<DataTemplate>
<StackPanel>
<TextBlock Text="{Binding Name}" />
<TextBlock Text="{Binding Id}" />
<TextBlock Tag="{Binding Address}" />
</StackPanel>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
I am fairly new to coding and I am building a database UI.
What I need to do is click on a row in a listview and get the return of the Id.
Below is the code I have but it gets an 'Exception User-Unhandled System.ArgumentNullException: value cannot be null'.
Any help will be predicated.
UWP Xaml <ListView x:Name="ListItems" IsItemClickEnabled="True" ItemClick="ListItems_ItemClick" Tag="{Binding Id}"
>
private void ListItems_ItemClick(object sender, ItemClickEventArgs e)
{
var id = (sender as ListView).Tag as string;
{
testbox.Text = id;
}
Full List View
<ListView x:Name="ListItems" IsItemClickEnabled="True" ItemClick="ListItems_ItemClick" Tag="{Binding Id}"
>
<ListView.ItemTemplate >
<DataTemplate >
<Border
BorderThickness="0,0,0,0">
<Grid HorizontalAlignment="Stretch">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="250" />
<ColumnDefinition Width="130" />
<ColumnDefinition Width="150" />
<ColumnDefinition Width="200" />
<ColumnDefinition Width="200" />
<ColumnDefinition Width="200" />
<ColumnDefinition Width="auto" />
</Grid.ColumnDefinitions>
<Grid.Resources>
<Style TargetType="TextBlock">
<Setter Property="Padding" Value="8,0,0,0" />
</Style>
</Grid.Resources>
<TextBlock
Grid.Column="0"
HorizontalAlignment="Stretch"
Text="{Binding LegalName, Mode=OneWay}" />
<TextBlock
Grid.Column="1"
HorizontalAlignment="Stretch"
Text="{Binding PhoneNumber, Mode=OneWay}" />
<TextBlock
Grid.Column="2"
HorizontalAlignment="Stretch"
Text="{Binding EmailAddress, Mode=OneWay}" />
<TextBlock
Grid.Column="3"
HorizontalAlignment="Stretch"
Text="{Binding HomeAddress, Mode=OneWay}" />
<TextBlock
Grid.Column="4"
HorizontalAlignment="Stretch"
Text="{Binding PostalAddress, Mode=OneWay}" />
<TextBlock
Grid.Column="5"
HorizontalAlignment="Stretch"
Text="{Binding Id, Mode=OneWay}" />
</Grid>
</Border>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
Here's a very easy approach. Bind the TextChanged event of all the texboxes to a TextChanged event :
XAML
<TextBlock Grid.Column="0" TextChanged="textbox_TextChanged".../>
C#
private string selectedText;
private void textbox_TextChanged(object sender, EventArgs e)
{
selectedtext = (sender as TextBlock).Text
}
private void ListItems_ItemClick(object sender, ItemClickEventArgs e)
{
///use selectedtext string as you want
}
do it Like that
1 - do not bind id to list-view Tag because it is Object.
2 - get your id like that
private void ListItems_ItemClick(object sender, ItemClickEventArgs e)
{
if ((e != null) && (e.Item != null))
{
var selected = (lsv.SelectedItem as yourClassType);
var yorItemID=selected .id;
}
}
I am new to c# WPF app developing, currently I write my first application and I was able to display a list on a window but only in one box.
Fitness box works perfectly but I can't get second one to work. If I change the order and put WeightList first then it works and ActivityList is not displayed. Here is the code:
XAML:
<Grid>
<Border BorderBrush="Black" BorderThickness="1" HorizontalAlignment="Left" Height="178" VerticalAlignment="Top" Width="220" Margin="0,3,0,0">
<Grid>
<TextBlock TextWrapping="Wrap" TextAlignment="Center" Height="20" VerticalAlignment="Top"><Run Text="FITNESS"/></TextBlock>
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="88*"/>
<ColumnDefinition Width="13*"/>
</Grid.ColumnDefinitions>
<ListView HorizontalAlignment="Left"
Height="150" Margin="0,26,0,0" VerticalAlignment="Top" Width="218"
x:Name="ActivityList" Grid.ColumnSpan="2">
<ListView.View>
<GridView>
<GridViewColumn Header="Type"
DisplayMemberBinding="{Binding Type}"/>
<GridViewColumn Header="Date"
DisplayMemberBinding="{Binding Date}"/>
<GridViewColumn Header="Distance"
DisplayMemberBinding="{Binding Distance}"/>
</GridView>
</ListView.View>
</ListView>
<Button Margin="8,0,0,156" Grid.Column="1" Width="20" Height="20" Click="Button_Click" Opacity="0.8">
<Grid HorizontalAlignment="Center">
<Grid.RowDefinitions>
<RowDefinition Height="4*"/>
<RowDefinition/>
</Grid.RowDefinitions>
<Image Source="Images/Button_11-512.png" Width="16" Margin="-15,-4,-1,-5" />
</Grid>
</Button>
</Grid>
</Grid>
</Border>
<Expander Header="NOTES" HorizontalAlignment="Left" Margin="0,181,0,0" VerticalAlignment="Top" Width="220" Height="75">
<StackPanel Margin="10,4,0,0">
<TextBox Margin="4" />
</StackPanel>
</Expander>
<Border BorderBrush="Black" BorderThickness="1" HorizontalAlignment="Left" Height="178" VerticalAlignment="Top" Width="220" Margin="238,3,0,0">
<Grid>
<TextBlock TextWrapping="Wrap" TextAlignment="Center" Height="20" VerticalAlignment="Top"><Run Text="WEIGHT CONTROL"/></TextBlock>
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="88*"/>
<ColumnDefinition Width="13*"/>
</Grid.ColumnDefinitions>
<ListView HorizontalAlignment="Left"
Height="150" Margin="0,26,0,0" VerticalAlignment="Top" Width="218"
x:Name="WeightList" Grid.ColumnSpan="2">
<ListView.View>
<GridView>
<GridViewColumn Header="Date"
DisplayMemberBinding="{Binding Date}"/>
<GridViewColumn Header="Weight"
DisplayMemberBinding="{Binding currentWeight}"/>
</GridView>
</ListView.View>
</ListView>
<Button Margin="8,0,0,156" Grid.Column="1" Width="20" Height="20" Opacity="0.8">
<Grid HorizontalAlignment="Center">
<Grid.RowDefinitions>
<RowDefinition Height="4*"/>
<RowDefinition/>
</Grid.RowDefinitions>
<Image Source="Images/Button_11-512.png" Width="16" Margin="-15,-4,-1,-5" />
</Grid>
</Button>
</Grid>
</Grid>
</Border>
<Expander Header="NOTES" HorizontalAlignment="Left" Margin="238,181,0,0" VerticalAlignment="Top" Width="220" Height="75">
<StackPanel Margin="10,4,0,0">
<TextBox Margin="4" />
</StackPanel>
</Expander>
</Grid>
MainWindow.cs
public partial class MainWindow : ModernWindow
{
public static ObservableCollection<Activity> Activities;
public static ObservableCollection<Weight> WeightControl;
public MainWindow()
{
InitializeComponent();
Activities = new ObservableCollection<Activity>() {
new Activity() {Type = "Running", Date = "15.07.2015", Distance = "5km"},
new Activity() {Type = "Cycling", Date = "17.07.2015", Distance = "120km"},
new Activity() {Type = "Swimming", Date = "19.07.2015", Distance = "3km"},
};
ActivityList.ItemsSource = Activities;
WeightControl = new ObservableCollection<Weight>() {
new Weight() {Date = "15.07.2015", currentWeight = 61.2},
new Weight() {Date = "17.07.2015", currentWeight = 62.1},
new Weight() {Date = "19.07.2015", currentWeight = 61.9},
};
Image with problem
You forgot to set WeightList.ItemsSource. this should do it:
WeightList.ItemsSource = WeightControl;
My itemscontrol is currently loading each row correctly. I am trying to get it to change the background color of each row when the user selects it.
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="100" />
<RowDefinition Height="30" />
<RowDefinition Height="*" />
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*" />
</Grid.ColumnDefinitions>
<Grid Grid.Row="0">
<Border BorderBrush="#BBBDBF" Background="#F4F4F4" BorderThickness="0,1,0,1" Margin="10,10,10,10"/>
<Image HorizontalAlignment="Left" Margin="10,0,0,0" Height="38" Width="38" Source="C:\Users\linda_l\Pictures\Cloud upload\database (1).png" />
<TextBlock FontSize="50" Foreground="#4092C2" Margin="60,0,0,0" HorizontalAlignment="left" Height="69" >Databases</TextBlock>
</Grid>
<Grid Background="White" Grid.Row="1">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="10" />
<ColumnDefinition Width="*" />
<ColumnDefinition Width="*" />
<ColumnDefinition Width="*" />
<ColumnDefinition Width="70" />
<ColumnDefinition Width="10" />
</Grid.ColumnDefinitions>
<Border BorderBrush="#BBBDBF" BorderThickness="0,0,0,1" Grid.Column="1" />
<Label Grid.Column="1" Content="Server Name" VerticalAlignment="Bottom" FontWeight="Bold" Foreground="#4092C2" />
<Border BorderBrush="#BBBDBF" BorderThickness="1,0,0,1" Grid.Column="2" />
<Label Grid.Column="2" Content="Source Database" VerticalAlignment="Bottom" FontWeight="Bold" Foreground="#4092C2" />
<Border BorderBrush="#BBBDBF" BorderThickness="1,0,0,1" Grid.Column="3" />
<Label Grid.Column="3" Content="Destination Database" VerticalAlignment="Bottom" FontWeight="Bold" Foreground="#4092C2" />
<Border BorderBrush="#BBBDBF" BorderThickness="1,0,0,1" Grid.Column="4" />
<Label Grid.Column="4" Content="Status" VerticalAlignment="Bottom" FontWeight="Bold" Foreground="#4092C2" />
</Grid>
<ItemsControl x:Name="itemscntrl" ItemsSource="{Binding DatabaseServers}" Background="White" BorderBrush="WhiteSmoke" BorderThickness="0" Grid.Row="2" Margin="0,5,0,0">
<ItemsControl.ItemTemplate>
<DataTemplate>
<Grid x:Name="grd" Background="White" >
<Grid.ColumnDefinitions>
<ColumnDefinition Width="10" />
<ColumnDefinition Width="*" />
<ColumnDefinition Width="*" />
<ColumnDefinition Width="*" />
<ColumnDefinition Width="70" />
<ColumnDefinition Width="10" />
</Grid.ColumnDefinitions>
<Image Source="{Binding StatusImage}" Height="10" Width="10" />
<Label Grid.Column="1" HorizontalAlignment="Left" Content="{Binding ServerName}" />
<Label Grid.Column="2" HorizontalAlignment="Left" Content="{Binding SourceDatabase}" />
<TextBox x:Name="dst" Grid.Column="3" Text="{Binding DestinationDatabase , Mode=TwoWay, UpdateSourceTrigger=LostFocus}" VerticalAlignment="Top" />
<Label Grid.Column="4" Content="{Binding Status}" VerticalAlignment="Top" />
<Button Grid.Column="4" BorderThickness="0" HorizontalAlignment="Center" Width="50" Margin="3" Content="{Binding Status}" Command="{Binding EnabledCommand}" CommandParameter="{Binding}" />
</Grid>
<DataTemplate.Triggers>
<DataTrigger Binding="{Binding selected }" Value="True">
<Setter Property="Background" Value="Yellow" TargetName="dst" />
</DataTrigger>
</DataTemplate.Triggers>
</DataTemplate>
</ItemsControl.ItemTemplate>
</ItemsControl>
</Grid>
Which currently looks like this:
I tried adding a DataTemplate.Triggers but it doesn't seam to do anything. How exactly do you detect that a row in a itemscontrol has been selected? The only examples I have found use a datagrid. I tried changing mine to a datagrid instead of the itemscontrol, but then the it wouldn't load the data.
Datagrid:
<DataGrid x:Name="grd" Background="White" DataContext="{Binding DatabaseServers}" Grid.Row="2">
<Image Source="{Binding StatusImage}" Height="10" Width="10" />
<Label Grid.Column="1" HorizontalAlignment="Left" Content="{Binding ServerName}" />
<Label Grid.Column="2" HorizontalAlignment="Left" Content="{Binding SourceDatabase}" />
<TextBox x:Name="dst" Grid.Column="3" Text="{Binding DestinationDatabase , Mode=TwoWay, UpdateSourceTrigger=LostFocus}" VerticalAlignment="Top" />
<Label Grid.Column="4" Content="{Binding Status}" VerticalAlignment="Top" />
<Button Grid.Column="4" BorderThickness="0" HorizontalAlignment="Center" Width="50" Margin="3" Content="{Binding Status}" Command="{Binding EnabledCommand}" CommandParameter="{Binding}" />
</DataGrid>
Just shows a bunch of lines there is no data in each row.
I am very new to WPF so I cant really figure out what I am doing wrong here.
Here is what you want using DataGrid i m using MVVM
Window.xaml
<Grid Margin="10">
<StackPanel Orientation="Vertical">
<Label Content="DataBases" Width="150" Height="50" HorizontalAlignment="Left" FontSize="20"/>
<DataGrid Name="DgDataSource" AutoGenerateColumns="False" CanUserAddRows="False" ItemsSource="{Binding SourceData}">
<DataGrid.Columns>
<DataGridTextColumn Header="ServerName" Binding="{Binding ServerName}" Width="2*"/>
<DataGridTextColumn Header="SourceDatabase" Binding="{Binding SourceDatabase}" Width="2*"/>
<DataGridTextColumn Header="DestinationDatabase" Binding="{Binding DestinationDatabase}" Width="2*"/>
<DataGridTemplateColumn Width="*" Header="Status" >
<DataGridTemplateColumn.CellTemplate>
<DataTemplate>
<Button Content="{Binding Status}" Command="{Binding EnabledCommand}"></Button>
</DataTemplate>
</DataGridTemplateColumn.CellTemplate>
</DataGridTemplateColumn>
</DataGrid.Columns>
</DataGrid>
</StackPanel>
</Grid>
View Model
public class WindowViewModel
{
public ObservableCollection<DataSource> SourceData { get; set; }
public WindowViewModel()
{
Initialize();
}
private void Initialize()
{
SourceData = new ObservableCollection<DataSource>
{
new DataSource() {Status = "Stop", ServerName = "Test 1", SourceDatabase = "Unknown",DestinationDatabase = "blabla....."},
new DataSource() {Status = "Work", ServerName = "Test 2", SourceDatabase = "Unknown",DestinationDatabase = "blabla....."},
new DataSource() {Status = "Stop", ServerName = "Test 3", SourceDatabase = "Unknown",DestinationDatabase = "blabla....."}
};
}
}
Model
public class DataSource
{
public string Status { get; set; }
public string ServerName { get; set; }
public string SourceDatabase { get; set; }
public string DestinationDatabase { get; set; }
}
I have a requirement like when I click on Button Flyout should come with the list of dynamic data and specified template. Below is the code in Xaml. But the Flyout is not Loading with any data.
<Button Content="Folders" >
<FlyoutBase.AttachedFlyout>
<Flyout >
<ListView x:Name="lstEmailFolder" >
<ListView.ItemTemplate>
<DataTemplate>
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*"/>
<ColumnDefinition Width="40"/>
</Grid.ColumnDefinitions>
<Image Source="/Images/Favorite_icon.png" Height="30" Width="30" Grid.Column="1" />
<TextBlock Text="{StaticResource Foldername}" Width="30" Height="30" Foreground="White" FontSize="20"/>
</Grid>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
</Flyout>
</FlyoutBase.AttachedFlyout>
</Button>
You havent bind Itemsource property to Listview and instead of Text="{StaticResource Foldername}" use Text="{Binding Foldername}"
xaml
<Button Content="Display Flyout">
<Button.Flyout>
<Flyout>
<ListView x:Name="lstEmailFolder" >
<ListView.ItemTemplate>
<DataTemplate>
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*"/>
<ColumnDefinition Width="40"/>
</Grid.ColumnDefinitions>
<TextBlock Text="{Binding Foldername}" Width="30" Height="30" Foreground="White" FontSize="20"/>
</Grid>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
</Flyout>
</Button.Flyout>
</Button>
c#
this.InitializeComponent();
List<FlyoutData> data = new List<FlyoutData>();
data.Add(new FlyoutData("Folder1"));
data.Add(new FlyoutData("Folder2"));
lstEmailFolder.ItemsSource = data;
public class FlyoutData
{
public string Foldername { get; set; }
public FlyoutData(string Foldername)
{
this.Foldername = Foldername;
}
}