I using a RadDataGrid on an application Windows 8.1. The grid has 3 columns: Name, description and template column with a "select" button. When user press Select button, I'd like that program shows an message with id of selected item
This is my code.
<Grid:RadDataGrid x:Name="MyGrid" AutoGenerateColumns="False" VerticalAlignment="Center">
<Grid:RadDataGrid.Columns>
<Grid:DataGridTextColumn CanUserFilter="False" CanUserEdit="False" PropertyName="Name" Header="Name">
</Grid:DataGridTextColumn>
<Grid:DataGridTextColumn CanUserFilter="False" CanUserEdit="False" PropertyName="Description" Header="Description">
</Grid:DataGridTextColumn>
<Grid:DataGridTemplateColumn CanUserFilter="False" CanUserEdit="False">
<Grid:DataGridTemplateColumn.CellContentTemplate>
<DataTemplate>
<StackPanel>
<Button x:Name="BtnSelect" Content="Select" HorizontalAlignment="Center" Click="BtnSelect_OnClick"></Button>
</StackPanel>
</DataTemplate>
</Grid:DataGridTemplateColumn.CellContentTemplate>
</Grid:DataGridTemplateColumn>
</Grid:RadDataGrid.Columns>
</Grid:RadDataGrid>
Code-behind
private void BtnSelect_OnClick(object sender, RoutedEventArgs e)
{
?
}
Related
Let's say I have a StackPanel (Orientation="Horizontal") with a fixed width and a variable/unknown amount of children, how do I tell all the children in XAML (not in code) to set their widths' to all be equal and fill up the entire StackPanel's width?
It's easy enough to do with Grid when you know the number of children (just use ColumnDefinitions with Width="*"), but I'm not sure how to do it with panels (StackPanel, PivotHeaderPanel, etc) or lists (GridView, ListView, etc).
According to your description, what you need is a panel like the UniformGrid in WPF. UniformGrid provides a way to arrange content in a grid where all the cells in the grid have the same size. However there is no build-in UniformGrid in UWP. We can implement it by ourselves or use a third party UniformGrid like what in WinRTXamlToolkit.
Here using the UniformGrid in WinRTXamlToolkit for example. To use WinRTXamlToolkit, we can install it from nuget: WinRT XAML Toolkit for Windows 10.
Then add xmlns in the page like:
xmlns:toolkit="using:WinRTXamlToolkit.Controls"
After this, we can use the UniformGrid like:
<toolkit:UniformGrid Rows="1" />
Here I set the Rows property to 1 and the Columns property to the default value 0. A value of zero (0) for the Columns property specifies that the column count is computed based on the number of rows and the number of visible child elements that are in the Grid. So all the children in this UniformGrid will be put in one row and as this is a UniformGrid, all the columns will have the same width.
Following is a sample that uses UniformGrid as the ItemsPanel of a GridView:
XAML:
<Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
<StackPanel>
<GridView x:Name="MyGridView" Height="60">
<GridView.ItemsPanel>
<ItemsPanelTemplate>
<toolkit:UniformGrid Rows="1" />
</ItemsPanelTemplate>
</GridView.ItemsPanel>
<GridView.ItemContainerStyle>
<Style TargetType="GridViewItem">
<Setter Property="HorizontalContentAlignment" Value="Stretch" />
</Style>
</GridView.ItemContainerStyle>
<GridView.ItemTemplate>
<DataTemplate>
<StackPanel Background="Red">
<TextBlock HorizontalAlignment="Center" FontSize="30" Text="{Binding }" />
</StackPanel>
</DataTemplate>
</GridView.ItemTemplate>
</GridView>
<Button Click="Button_Click">Add a item</Button>
</StackPanel>
</Grid>
Code-behind:
public sealed partial class MainPage : Page
{
private ObservableCollection<string> myList = new ObservableCollection<string> { "1", "2", "3", "4", "5" };
private int i = 6;
public MainPage()
{
this.InitializeComponent();
MyGridView.ItemsSource = myList;
}
private void Button_Click(object sender, RoutedEventArgs e)
{
myList.Add(i.ToString());
i += 1;
}
}
And it looks like:
I am searching to add Context menu in every item of my listbox item. I know it was very easy in wp8 app using toolkit. However, Toolkit is not supported in uwp.
How can I add Context menu in uwp listbox item?
Thanks!
You can create ListBox.ItemTemplate with MenuFlyout, for example:
<ListBox.ItemTemplate>
<DataTemplate>
<Grid PointerEntered="Grid_PointerEntered" >
<FlyoutBase.AttachedFlyout>
<MenuFlyout>
<MenuFlyoutItem x:Name="EditButton"
Text="Edit"
Click="EditButton_Click"/>
<MenuFlyoutItem x:Name="DeleteButton"
Text="Delete"
Click="DeleteButton_Click"/>
</MenuFlyout>
</FlyoutBase.AttachedFlyout>
<TextBlock Text="{Binding Name}" />
</Grid>
</DataTemplate>
</ListBox.ItemTemplate>
Handle the PointerEntered event to show Flyout when the pointer has been moved into an ListBoxItem:
private void Grid_PointerEntered(object sender, PointerRoutedEventArgs e)
{
FrameworkElement senderElement = sender as FrameworkElement;
FlyoutBase flyoutBase = FlyoutBase.GetAttachedFlyout(senderElement);
flyoutBase.ShowAt(senderElement);
}
Handle MenuFlyoutItem Click event:
private void EditButton_Click(object sender, RoutedEventArgs e)
{
var datacontext = (e.OriginalSource as FrameworkElement).DataContext;
//this datacontext is probably some object of some type T
}
private void DeleteButton_Click(object sender, RoutedEventArgs e)
{
var datacontext = (e.OriginalSource as FrameworkElement).DataContext;
//this datacontext is probably some object of some type T
}
Please check my feasible sample on Github
here I attach a code to get the value in text block, but I want to print the txt1 and date1 value in list view
xaml code
<ListBox Margin="0,0,-12,0" x:Name="myList">
<ListBox.ItemTemplate>
<DataTemplate>
<StackPanel>
<TextBlock x:Name="txt1" Text="{Binding date1}" Style="{StaticResource PhoneTextExtraLargeStyle}"/>
<StackPanel Orientation="Horizontal" Margin="0,0,0,17">
<TextBlock x:Name="txt2" Margin="5,0,0,0" Style="{StaticResource PhoneTextSubtleStyle}"/>
</StackPanel>
</StackPanel>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
c# code
textBlockNumber.Text = "1232"
txt1.Text = textBlockNumber.Text;
DateTime date1 = DateTime.Now;
you will have to add a item source of the list box ..
List<data> asd = new List<data>);
asd.Add(new data(textBlockNumber.Text,DateTime.Now));
myList.ItemSource = asd;
make a data class
public class data
{
public string liststing {get;set;}
public DateTime datetime {get;set;}
public data(string textblocktext,DateTime date)
{
this.liststring = textblocktext;
this.datetime = date;
}
}
then bind the text of textblock in xaml like Text="{Binding liststring}" and your other Text="{Binding datetime}"
i hope it helps ...
I am new to the MVVM philosophy, and my question may be stupid but hey, I try anyway.
I have a view associated with a model view. In this view, I open a dialog box when the user presses a button.
From this dialog box, I want to refresh the main view without closing the dialog.
The dialog and the main view share the same view model, and I have a property that is binded in the main view.
But when I change the binded property from from the dialog, it is well updated, but not the main view.
Here some code:
MainView.xaml:
<TextBox x:Name="tnNomModele"
HorizontalAlignment="Left"
Height="23"
Margin="142,35,0,0"
TextWrapping="Wrap"
VerticalAlignment="Top"
Width="143"
Text="{Binding MyProperty, UpdateSourceTrigger=PropertyChanged}"/>
ViewModel.cs
public string MyProperty
{
get
{
return _mystring ;
}
set
{
_mystring = value;
RaisePropertyChanged("MyProperty");
}
}
Here's how I call the dialog, on the command binded with a button on the main view:
MyDialog diag = new MyDialog ();
diag.ShowDialog();
And in the command binded with a button on the dialog, I change the value of MyProperty.
But nothing happens in the main view...
I think you need to change your binding:
<TextBox x:Name="tnNomModele" HorizontalAlignment="Left" Height="23" Margin="142,35,0,0" TextWrapping="Wrap" VerticalAlignment="Top" Width="143" Text="{Binding MyProperty,Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}"/>
The change is that you're using the default Binding mode, which is OneWay. This means that the ViewModel can push changes to the View but will not receieve changes made from the View. Using TwoWay means that the ViewModel receives notifications from the View when a property changes.
On my wpf window, I have got an image button. Does anyone have any idea how to assign a short cut for this button like "Cntrl + O".
I can put "_" to trigger click on normal button.
<Button Margin="89,73,114,106" Name="button1" Click="button1_Click">
<StackPanel Name="_StackPanel">
<Image Source="image.png" ></Image>
</StackPanel>
</Button>
In WPF general keyboard shortcuts (unlike the special case of Alt access keys) aren't assigned to buttons, they are assigned to actions. When you want both a Button (or menu item, multiple buttons, etc.) and a key command for the same action you can use a single Command for both. For a custom RoutedCommand you can assign KeyGestures to fire the command:
public static RoutedCommand MyCommand { get; private set; }
static Window1()
{
MyCommand = new RoutedCommand("MyCommand", typeof(Window1), new InputGestureCollection { new KeyGesture(Key.O, ModifierKeys.Control) });
}
public Window1()
{
InitializeComponent();
CommandBindings.Add(new CommandBinding(MyCommand, (_, e) => MessageBox.Show("Command fired")));
}
And then also assign it as the Button's Command:
<Button Content="Click Me" Command="{x:Static local:Window1.MyCommand}"/>