I'm having trouble with binding a ListBox and I can't for the life of me figure out what's wrong. Most of the time it works fine, but in a special test configuration I have for my application it doesn't work and it's driving me crazy. I've literally stared at it for hours and tried all sorts of things. It's gotta be a binding issue, but I can't find it. There aren't any exceptions or binding errors being thrown that I can see.
The test configuration is identical to my debug configuration, but with an additional compilation symbol. It allows me to test the WPF application without running the entire software stack. It's an "offline mode" for all intents and purposes.
<ribbon:Ribbon Height="45">
<ribbon:Ribbon.ApplicationMenu>
<ribbon:RibbonApplicationMenu Width="56">
<ribbon:RibbonApplicationMenuItem Header="New Campaign" Command="{Binding Path=AddCampaign}" ImageSource="images\new.png"/>
<ribbon:RibbonApplicationMenuItem Header="Save Campaigns" Command="{Binding Path=Save}" ImageSource="images\save.png" />
<ribbon:RibbonApplicationMenuItem Header="Import Campaign" Command="{Binding Path=ImportCampaign}" ImageSource="images\campaign-import-128x128.png"/>
<ribbon:RibbonApplicationMenuItem Header="Export Campaign" Command="{Binding Path=ExportCampaign}" ImageSource="images\campaign-export-128x128.png" />
<ribbon:RibbonApplicationMenuItem Header="Terms of Use" Command="{Binding Path=Eula}" ImageSource="images\terms.png"/>
<ribbon:RibbonApplicationMenuItem Header="Resources" Command="{Binding Path=Resources}" ImageSource="images\resource.jpg"/>
<ribbon:RibbonApplicationMenuItem Header="About" Command="{Binding Path=About}" ImageSource="images\resource.jpg"/>
<ribbon:RibbonApplicationMenu.AuxiliaryPaneContent>
<StackPanel>
<StackPanel Orientation="Horizontal">
<Label Width="130" Content="Campaign"/>
<Label Width="60" Content="Duplicate"/>
<Label Width="50" Content="Delete"/>
</StackPanel>
<ListBox ItemsSource="{Binding Path=Repository.Campaigns}"
SelectedItem="{Binding Path=SelectedCampaign, Mode=TwoWay}"
ItemContainerStyle="{StaticResource ListBoxItemStyle}"
Height="212"
ScrollViewer.VerticalScrollBarVisibility="Visible"
ScrollViewer.HorizontalScrollBarVisibility="Hidden">
<ListBox.ItemTemplate>
<DataTemplate>
<StackPanel Orientation="Horizontal">
<Label Content="{Binding Path=Name}" Width="130" />
<Button Command="{Binding RelativeSource={RelativeSource Mode=FindAncestor, AncestorType={x:Type ItemsControl}}, Path=DataContext.DuplicateCampaign}"
CommandParameter="{Binding Path=Name}" Width="60">
<Button.Template>
<ControlTemplate>
<Border HorizontalAlignment="Center" VerticalAlignment="Center" >
<Image Source="/asdf;component/images/duplicate.png" Width="24" Height="24"/>
</Border>
</ControlTemplate>
</Button.Template>
</Button>
<Button Command="{Binding RelativeSource={RelativeSource Mode=FindAncestor, AncestorType={x:Type ItemsControl}}, Path=DataContext.RemoveCampaign}"
CommandParameter="{Binding Path=Name}" Width="50">
<Button.Template>
<ControlTemplate>
<Border HorizontalAlignment="Center" VerticalAlignment="Center" >
<Image Source="/asdf;component/images/delete.png" Width="24" Height="24"/>
</Border>
</ControlTemplate>
</Button.Template>
</Button>
</StackPanel>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
<Button Content="View Archived"
Command="{Binding Path=ArchivedCampaigns}"></Button>
</StackPanel>
</ribbon:RibbonApplicationMenu.AuxiliaryPaneContent>
<ribbon:RibbonApplicationMenu.FooterPaneContent>
<StackPanel Orientation="Horizontal" HorizontalAlignment="Right">
<ribbon:RibbonButton Label="LOGOUT" Command="{Binding Path=Logout}" />
<ribbon:RibbonButton Label="EXIT" Command="{Binding Path=Exit}" />
</StackPanel>
</ribbon:RibbonApplicationMenu.FooterPaneContent>
</ribbon:RibbonApplicationMenu>
</ribbon:Ribbon.ApplicationMenu>
Here's my login method where the window is created and the DataContext is bound. UITEST is my offline mode configuration.
private void Login()
{
MainVM = new ViewModel.MainWindowVM();
_mainWindow = new RibbonMainWindow
{
DataContext = MainVM
};
//Prompt user for login.
#if UITEST
_loggedIn = true;
MainVM.LoadData();
#else
var loginWindow = new Login();
var login = new ViewModel.LoginVM();
loginWindow.DataContext = login;
loginWindow.ShowDialog();
if (loginWindow.DialogResult != null) _loggedIn = loginWindow.DialogResult.Value;
#endif
if (_loggedIn && MainVM.Loaded)
{
_mainWindow.ShowDialog();
}
}
Edit: As near as I can guess, it might be due to using the legacy RibbonControlsLibrary from the pre .NET 4.5 days. I retargeted the software to .NET 4.6.1 last year so I switched to the Ribbon built-in to .NET and now it works oddly enough. If I try to mess with anything else in the window it just seems to break again. Like if I try to strongly-type the DataContext in the window.
As near as I can guess, it might be due to using the legacy RibbonControlsLibrary from the pre .NET 4.5 days. I retargeted the software to .NET 4.6.1 last year so I switched to the Ribbon built-in to .NET and now it works oddly enough. If I try to mess with anything else in the window it just seems to break again. Like if I try to strongly-type the DataContext in the window.
Related
I tried using a textbox inside a WPF Material Design transitioner slide. The textbox is visible even when changing slides.
A dotted line from the textbox on the next slide is visible, and viceversa.
Has anyone else encountered this issue? Is there any workaround I could use?
This is the xaml I used. I am using the transitioner control although I believe the flipper control causes a similar effect when used with textboxes.
<Grid>
<materialDesign:Transitioner SelectedIndex="0">
<materialDesign:TransitionerSlide>
<StackPanel HorizontalAlignment="Center">
<TextBlock Text="Hello, this is my first page!" Margin="10"/>
<TextBox materialDesign:HintAssist.Hint="Type your first text here!" Margin="10"/>
<Button Command="{x:Static materialDesign:Transitioner.MoveNextCommand}" Content=">" HorizontalAlignment="Center" Margin="10"/>
</StackPanel>
</materialDesign:TransitionerSlide>
<materialDesign:TransitionerSlide>
<StackPanel HorizontalAlignment="Center">
<TextBlock Text="Hello, this is my 2nd page!" Margin="15"/>
<TextBox materialDesign:HintAssist.Hint="Type your second text here!" Margin="15"/>
<Button Command="{x:Static materialDesign:Transitioner.MovePreviousCommand}" Content="<" HorizontalAlignment="Center" Margin="15"/>
</StackPanel>
</materialDesign:TransitionerSlide>
</materialDesign:Transitioner>
</Grid>
I believe the issue might lie in the dotted line that appears when a textbox is disabled, so possibly by removing that, the textbox would no longer show through slides. But that's just my guess.
Any help is appreciated!
For the best approach, please refer to this answer.
Try to add the following implicit style to your App.xaml or window:
<Style TargetType="materialDesign:BottomDashedLineAdorner">
<Setter Property="Visibility" Value="Collapsed" />
</Style>
I try several ways and I found solution
please set BorderThickness="0" in textboxes like this
<TextBox materialDesign:HintAssist.Hint="Type your second text here!" Margin="10" BorderThickness="0"/>
Wrapping the offending control in:
<AdornerDecorator>
</AdornerDecorator>
seems to work.
Hi problem is in your margin , please set all your margins to 10 like this
<Grid>
<materialDesign:Transitioner SelectedIndex="0">
<materialDesign:TransitionerSlide>
<StackPanel HorizontalAlignment="Center">
<TextBlock Text="Hello, this is my first page!" Margin="10"/>
<TextBox materialDesign:HintAssist.Hint="Type your first text here!" Margin="10"/>
<Button Command="{x:Static materialDesign:Transitioner.MoveNextCommand}" Content=">" HorizontalAlignment="Center" Margin="10"/>
</StackPanel>
</materialDesign:TransitionerSlide>
<materialDesign:TransitionerSlide>
<StackPanel HorizontalAlignment="Center">
<TextBlock Text="Hello, this is my 2nd page!" Margin="10"/>
<TextBox materialDesign:HintAssist.Hint="Type your second text here!" Margin="10"/>
<Button Command="{x:Static materialDesign:Transitioner.MovePreviousCommand}" Content="<" HorizontalAlignment="Center" Margin="15"/>
</StackPanel>
</materialDesign:TransitionerSlide>
</materialDesign:Transitioner>
</Grid>
I hope it help you
I want to write the event for list box from View Model. I try like this:-
<ListBox.ItemTemplate>
<DataTemplate>
<Border BorderBrush="Gray" Padding="5" BorderThickness="1">
<StackPanel Orientation="Horizontal">
<Border BorderBrush="Wheat" BorderThickness="1">
<Image Name="ListPersonImage" Source="{Binding PersonImage}" Height="100" Width="100" Stretch="Uniform" Margin="10,0,0,0"/>
</Border>
<TextBlock Text="{Binding FirstName}" Name="firstName" Width="200" Foreground="White" Margin="10,10,0,0" FontWeight="SemiBold" FontSize="22" />
<Button DataContext="{Binding DataContext, ElementName=listBox1}" Command="{Binding addPerson}" Height="80" Width="80" >
<Button.Background>
<ImageBrush ImageSource="{Binding imagePath, Converter={StaticResource pathToImageConverter}}" Stretch="Fill" />
</Button.Background>
</Button>
</StackPanel>
</Border>
<i:Interaction.Triggers>
<i:EventTrigger EventName="Tap">
<i:InvokeCommandAction Command="{Binding ItemSelectedCommand,Mode=OneWay}" CommandParameter="{Binding}"/>
</i:EventTrigger>
</i:Interaction.Triggers>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
My ViewModel:-
public RelayCommand<MVVMListBoxModel> ItemSelectedCommand { get; private set; }
public MVVMListBoxViewModel()
{
ItemSelectedCommand = new RelayCommand<MVVMListBoxModel>(ItemSelected);
}
private void ItemSelected(MVVMListBoxModel myItem)
{
MessageBox.Show("Name==>" + myItem.FirstName);
//throw new NotImplementedException();
}
But nothing happening. Please let me know where I did mistake.
Thanks in advance.
Check output window to see if you got binding error. It seems that you got one, because you have ItemSelectedCommand defined in MVVMListBoxViewModel but ListBoxItem's DataContext is corresponding MVVMListBoxModel, so binding engine couldn't find the command.
Try to move definition of ItemSelectedCommand to MVVMListBoxModel and see if message box get displayed this way.
Do you want the trigger to be upon the SelectionChanged of the Listbox Item? Then the trigger should be outside the <ListBox.ItemTemplate> ... </ListBox.ItemTemplate>.
And the trigger should bind the CommandParamter to the SelectedItem
<i:Interaction.Triggers>
<i:EventTrigger EventName="Tap">
<i:InvokeCommandAction Command="{Binding ItemSelectedCommand,Mode=OneWay}" CommandParameter="{Binding SelectedItem}"/>
</i:EventTrigger>
</i:Interaction.Triggers>
Can someone give me an example of how to style a button with XAML hat has three states (hover, normal, pressed). i want the whole area of the button to be covered with an image (one for each of the three different states) and i want text to be on top that also has three different colors for the different states. i have something like this already (without the color states on the textblock). the problem i'm having at this point is that the textblock is blocking the input events for the button undernearth (i also haven't implemented the color changes for the textblock....
current code:
<DataTemplate x:Name="SubjectItemTemplate">
<Canvas Width="225" Height="225">
<Button Canvas.Left="0" Canvas.Top="0"
Command="{Binding ElementName=LayoutRoot, Path=DataContext.NavigateToUnitsPage}"
CommandParameter="{Binding}">
<Button.Template>
<ControlTemplate>
<Grid Background="{Binding LightThemeColor}" Width="205" Height="205">
<controls:ImageButton HorizontalAlignment="Center" VerticalAlignment="Top" Margin="0,0,0,0"
NormalStateImageSource="{Binding ImageUriNormal}"
HoverStateImageSource="{Binding ImageUriHover}"
PressedStateImageSource="{Binding ImageUriPressed}" Command="{Binding ElementName=LayoutRoot, Path=DataContext.NavigateToUnitsPage}"
CommandParameter="{Binding}"/>
<TextBlock Text="{Binding Name}" FontSize="18" TextWrapping="Wrap" TextAlignment="Center" HorizontalAlignment="Center" VerticalAlignment="Top" Margin="0,168,0,0" />
</Grid>
</ControlTemplate>
</Button.Template>
</Button>
</Canvas>
</DataTemplate>
The reason that the ImageButton events are not being handled as expected with the TextBlock is because the TextBlock is located in-line with the ImageButton and not contained inside the ImageButton. To change this, the TextBlock has to be placed inside the ImageButton.
<controls:ImageButton HorizontalAlignment="Center" VerticalAlignment="Top" Margin="0,0,0,0"
NormalStateImageSource="{Binding ImageUriNormal}"
HoverStateImageSource="{Binding ImageUriHover}"
PressedStateImageSource="{Binding ImageUriPressed}" Command="{Binding ElementName=LayoutRoot, Path=DataContext.NavigateToUnitsPage}" CommandParameter="{Binding}" >
<TextBlock Text="{Binding Name}" FontSize="18" TextWrapping="Wrap" TextAlignment="Center" HorizontalAlignment="Center" VerticalAlignment="Top" Margin="0,168,0,0" />
</controls:ImageButton>
I tried to implement a simple Menu with wpf for the surface 2.0/pixelsense.
<s:SurfaceWindow x:Class="MenuTrial.SurfaceWindow1"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:s="http://schemas.microsoft.com/surface/2008"
xmlns:MenuTrial="clr-namespace:MenuTrial"
xmlns:Properties="clr-namespace:MenuTrial.Properties"
Title="MenuTrial"
>
<Grid Name="MenuGrid" Height="102" VerticalAlignment="Bottom">
<s:ScatterView HorizontalAlignment="Stretch" VerticalAlignment="Stretch">
<s:ScatterView.Resources>
<Image x:Shared="false" x:Key="IconPhoto" Source="Resources\Icons\photo.png"/>
<Image x:Shared="false" x:Key="IconCopy" Source="Resources\Icons\copy.png"/>
</s:ScatterView.Resources>
<s:ScatterViewItem Height="139"
Width="224"
Orientation="-23"
Background="#FF787878">
<s:ElementMenu
Name="MainMenu"
ActivationMode="AlwaysActive"
ActivationHost="{Binding RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type s:ScatterViewItem}}}"
>
<s:ElementMenuItem Header="Menu1"/>
<s:ElementMenuItem Header="Menu2"/>
<s:ElementMenuItem Header="{x:Static Resources:Resources.IconPhoto}" Icon="{StaticResource IconPhoto}">
<s:ElementMenuItem Header="{x:Static Resources:Resources.Copy}" Icon="{StaticResource IconCopy}" Command="{x:Static MenuTrial:SurfaceWindow1.ShowMessageCommand}" CommandParameter="{Binding Path=Header, RelativeSource={x:Static RelativeSource.Self}}"/>
<s:ElementMenuItem Header="Menu 3.2" />
<s:ElementMenuItem Header="Menu 3.3"/>
</s:ElementMenuItem>
</s:ElementMenu>
</s:ScatterViewItem>
</s:ScatterView>
<TextBlock x:Name="textMessage" Width="500" Margin="40" TextAlignment="Center" HorizontalAlignment="Center" VerticalAlignment="Bottom" FontFamily="Segoe360" FontSize="17" />
</Grid>
The problem is, I get an unknown bild mistake. Key can't be NULL or something would it be in english. At the Header="{x:Static Resources....
It is exactly like in the Surface samples. I just wanted to show a message when the menu item was clickt.
Can anyone please help me? Thx
If you define this MenuItem under Resources section you need to provide it with a x:Key value. Resources can't be declared without Key -
<s:ElementMenuItem Header="{x:Static Resources:Resources.IconPhoto}"
Icon="{StaticResource IconPhoto}"
x:Key="MyMenuItem">
....
</s:ElementMenuItem>
I have a C# WPF app where there are some buttons on top to perform functions like table lookup or maintenance here:
<Border Grid.Row="0" CornerRadius="5" BorderBrush="AliceBlue" Margin="10" VerticalAlignment="Top" >
<StackPanel Orientation="Horizontal" Height="35" >
<Button Content="Upload File" Margin="0,0,3,0" Command="{Binding CmdUploadFileCtrl}" Width="100"></Button>
<Button Content="Medicine Price" Margin="0,0,3,0" Command="{Binding CmdMedicinePriceCtrl}" Width="100"></Button>
<Button Content="NDC Discounts" Margin="0,0,3,0" Command="{Binding CmdNDCDiscountCtrl}" Width="100"></Button>
<Button Content="Facility" Margin="0,0,3,0" Command="{Binding CmdFacilityCtrl}" Width="100"></Button>
</StackPanel>
</Border>
<sdk:DataGrid
Grid.Row="1" x:Name="dgFacility"
SelectionMode="Single"
SelectedItem="{Binding Path=SelectedItemFacility, Mode=TwoWay}"
ItemsSource="{Binding Path=LstFacility, Mode=TwoWay}"
AutoGenerateColumns="False"
HorizontalAlignment="Stretch"
VerticalAlignment="Stretch"
AllowDrop="False">
When user presses Facility tab it goes there, but when then tried to 'Upload file' that button is become disabled. How can I prevent this disabling?
Since the buttons are bound to commands, there should be code (somewhere) that is determining when the buttons are enabled/disabled.
Depending on what type of commanding is being used you may have a method named something like CanUploadFileCtrl or CmdUploadFileCtrl_CanExecute which returns true/false.