I have a stackpanel that contains many elements including buttons. I am not able to fire a method through ICommands. It works through adding an event handler in the code behind for the Button.Click event. Since, I am following a MVVM pattern, I want to fire a command. Also, this stackpanel is a datatemplate for my listviewitem.
<ListView.ItemTemplate>
<DataTemplate>
<StackPanel Orientation="Vertical" HorizontalAlignment="Center" IsHitTestVisible="True">
<Button Cursor="Hand" Command="{Binding MoveImageUp}">
<Button.Background>
<ImageBrush ImageSource="..."/>
</Button.Background>
</Button>
<Grid>
<Image Source="{Binding Path=Image}"/>
<TextBlock Height="20" Width="20" Text="{Binding Path=Order}" Opacity="0.8" HorizontalAlignment="Left" VerticalAlignment="Top"/>
</Grid>
<GridSplitter HorizontalAlignment="Center" Padding="1" />
</StackPanel>
</DataTemplate>
</ListView.ItemTemplate>
I have tried setting IsHitTestVisibile to true, does not work.
There was no DataContext set for the button. Thanks #Foggy Finder
<Button Cursor="Hand" Command="{Binding ElementName=ImagesList, Path=DataContext.MoveImageUp}" CommandParameter="{Binding}">
Related
I'm on a team of developers working on a new WPF application. We've got a usercontrol on the MainWindow which has a ScrollViewer. We've got VerticalScrollBarVisibility="Auto" set, which works fine, if the contents within the ScrollViewer become larger than the available space for the ScrollViewer. However, what doesn't happen, which I wish would happen, is the user cannot scroll the contents with the mouse wheel. In other places where we're using DataGrids, if the content of the DataGrid is larger than can be displayed vertically, the user can scroll the contents vertically using their mouse wheel. But they cannot do so within the ScrollViewer in the user control on MainWindow. If it's possible to make the contents scroll vertically with the mouse wheel, how is it done?
Here's a snippet of the ScrollViewer, with content removed for brevity:
<ScrollViewer
Grid.Row="1"
Margin="0,20,0,0"
Width="300"
VerticalScrollBarVisibility="Auto"
HorizontalAlignment="Left"
VerticalAlignment="Top">
<StackPanel>
<Expander
x:Name="PeopleSideExpander"
IsExpanded="{Binding PeopleSideIsExpanded}"
IsEnabled="True">
<Expander.Header>
<Button
x:Name="tilePeopleSide"
Content="People Side"
Command="{Binding PeopleSideExpanderCommand}"
Cursor="Hand" />
</Expander.Header>
<ListBox>
<ListBoxItem>
<Button Name="tileAgency" Content="Agencies" Command="{Binding ViewAgencyCommand}" />
</ListBoxItem>
<ListBoxItem>
<Button Name="tilePerson" Content="Personnel" Command="{Binding ViewPersonCommand}" />
</ListBoxItem>
<!-- Several other ListBoxItems removed for brevity -->
</ListBox>
</Expander>
<Expander
x:Name="HardwareSideExpander"
Grid.Row="1"
IsExpanded="{Binding HardwareSideIsExpanded}"
IsEnabled="True">
<Expander.Header>
<Button
x:Name="tileHardwareSide"
Content="Hardware Side"
Command="{Binding HardwareSideExpanderCommand}"
Cursor="Hand" />
</Expander.Header>
<ListBox>
<ListBoxItem>
<Button Name="tileEvent"
Content="Event"
IsEnabled="False"
Foreground="LightGray"
Command="{Binding ViewEventCommand}" />
</ListBoxItem>
<ListBoxItem>
<Button Name="tileInstrument"
Content="Instrument"
IsEnabled="False"
Foreground="LightGray"
Command="{Binding ViewInstrumentCommand}" />
</ListBoxItem>
<ListBoxItem>
<Button x:Name="tileHardwareProficiency"
Content="Proficiencies"
Visibility="Collapsed"
ToolTip="Not Implemented" />
</ListBoxItem>
<ListBoxItem>
<Button x:Name="tileSolution"
Content="Proficiency Solutions"
Command="{Binding ViewSolutionCommand}" />
</ListBoxItem>
</ListBox>
</Expander>
</StackPanel>
</ScrollViewer>
I`ve created big button which contains grid as below:
<Button Height="Auto" Width="Auto" Command="{Binding ContinueWithoutScan}" BorderThickness="0">
<Button.Template>
<ControlTemplate>
<Grid >
<TextBlock HorizontalAlignment="Center"
TextWrapping="Wrap" Text="Text"
VerticalAlignment="Center" FontWeight="DemiBold"
Height="Auto" Width="Auto"
FontSize="25" Foreground="White"/>
<materialDesign:PackIcon Height="Auto" Width="70" Kind="ChevronRight" Foreground="White"
VerticalAlignment="Center" HorizontalAlignment="Right"/>
</Grid>
</ControlTemplate>
</Button.Template>
</Button>
There is problem that only TextBlock inside Template is clickable. Does anyone know how do I make whole content clickable? I working with MVVM so I dont want make Grid.OnMouseEneter.
Is there option to do that of I have to use EventTriggers?
The Grid needs to have a Background other than the default null to receive input events. You may set a transparent background instead of null:
<Grid Background="Transparent">
...
</Grid>
I am using C# and WPF for my GUI. My goal is to display a progress bar under the wpf popup control.
I am using below code add a progress bar under the popup control.
<Popup HorizontalAlignment="Left" Margin="338,261,0,0" Name="popup1" VerticalAlignment="Top" Height="38" Width="153" >
<StackPanel Background="Red">
<ProgressBar Height="15" HorizontalAlignment="Left" Margin="349,272,0,0" Name="progressBar1" VerticalAlignment="Top" Width="130" Foreground="#FF3EA3EA" Value="{Binding ElementName=textBox1, Path=Text.Length, Mode=OneTime}" Maximum="140" />
</StackPanel>
</Popup>
Please Help me.
Thanx in advanced!
You should use below code for showing ProgressBar under the Popup control:
<Popup Name="popup1" HorizontalAlignment="Left" Margin="338,261,0,0" AllowsTransparency="True" VerticalAlignment="Top" Height="38" Width="153">
<Grid>
<ProgressBar HorizontalAlignment="Left"
Name="progressBar1" Height="25"
VerticalAlignment="Center" Width="130"
Foreground="#FF3EA3EA"
Value="{Binding ElementName=textBox1, Path=Text.Length, Mode=OneTime}"
Maximum="140" ForceCursor="False" />
</Grid>
</Popup>
I'm very new to Silverlight and trying to create a Button with a nested TextBlock, while having both live inside a Grid. Everything works fine except only the text is clickable...
<Grid x:Name="ValueHeadingContainer" Grid.Column="0" Grid.Row="0" Grid.RowSpan="2">
<Border Background="Transparent" BorderThickness="0,0,1,1" BorderBrush="#000" />
<Button Click="Button_Click" Name="ValueHeadingButton">
<Button.Template>
<ControlTemplate>
<TextBlock x:Name="ValueHeadingLabel"
Text="{Binding ValueLabel}"
Margin="10,0,0,0"
Style="{StaticResource FakeColumnHeader}"/>
</ControlTemplate>
</Button.Template>
</Button>
</Grid>
Only the textblock is clickable because you have not defined any other elements that will handle a mouse event. You need to put a wrapper around the textblock to increase the clickable surface area of your button.
I also suggest you set IsHitTestVisible on your TextBlock to false to prevent it interfering with any other mouse events.
<Button.Template>
<ControlTemplate>
<Border Background="Transparent">
<TextBlock x:Name="ValueHeadingLabel"
IsHitTestVisible="False"
Text="{Binding ValueLabel}"
Margin="10,0,0,0"
Style="{StaticResource FakeColumnHeader}"/>
</Border>
</ControlTemplate>
</Button.Template>
If all you want is a single button (not template), then it is sufficient:
<Button Click="Button_Click" Name="ValueHeadingButton">
<TextBlock x:Name="ValueHeadingLabel"
Text="{Binding ValueLabel}"
Margin="10,0,0,0"
Style="{StaticResource FakeColumnHeader}"/>
</Button>
I.e. you just use smth like <Button><TextBlock></TextBlock></Button> without content templates.
I have a two pages say Main.xaml and Details.xaml.Each page has a ListBox and I am setting each of it to a collection in ViewModel(Same collection).The strange thing is that when i select an item in Details page it calls the SelectionChanged event handler on Main page and Details page.Is this a bug?
I have solved the problem by unhooking SelectionChanged eventhandler in OnNavigatedFrom() method.
EDIT
In Main.Xaml I have something like below:
<ListBox Name="MainDataListBox" Margin="8,113,8,8" ItemsSource="{Binding DataList}" SelectionChanged="MainDataListBox_SelectionChanged">
<ListBox.ItemTemplate>
<DataTemplate>
<StackPanel Orientation="Horizontal" >
<Border BorderThickness="3" BorderBrush="#A5FFFFFF" Width="80" Margin="0,20,0,20" Height="60">
<Image Source="{Binding ImageUrl, Mode=OneWay}" VerticalAlignment="Stretch" Margin="0,0,0,0" Width="80" Height="60" Stretch="Fill" />
</Border>
<TextBlock TextWrapping="Wrap" Text="{Binding Title}" FontSize="40" FontWeight="Normal" VerticalAlignment="Center" Margin="30,0,0,0" />
</StackPanel>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
In Details.xaml also I have same kind of ListBox:
<ListBox Name="DetailDataListBox" Margin="8,113,8,8" ItemsSource="{Binding DataList}" SelectionChanged="DetailDataListBox_SelectionChanged">
<ListBox.ItemTemplate>
<DataTemplate>
<StackPanel Orientation="Horizontal" >
<Border BorderThickness="3" BorderBrush="#A5FFFFFF" Width="80" Margin="0,20,0,20" Height="60">
<Image Source="{Binding ImageUrl, Mode=OneWay}" VerticalAlignment="Stretch" Margin="0,0,0,0" Width="80" Height="60" Stretch="Fill" />
</Border>
<TextBlock TextWrapping="Wrap" Text="{Binding Title}" FontSize="40" FontWeight="Normal" VerticalAlignment="Center" Margin="30,0,0,0" />
</StackPanel>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
Both of the Pages Main and Details have seperate EvenHandlers MainDataListBox_SelectionChanged and DetailDataListBox_SelectionChanged.
The problem is when i select an Item in Details Page MainDataListBox_SelectionChanged is called first and then DetailDataListBox_SelectionChanged.
Also my viewmodel is a static one in App.cs and I am setting the data context of both these pages to same viewmodel.
Thanks and Regards
vaysage
As both listsboxes were bound to the same dataset a change in the selected time in one list would have affected the other.
Obviosuly you're found a work around but I'd recommend having a unique view model for each page. If the page is just a different way of displaying the same data use a single page and alter the display as appropriate. (Creating your own visual states may be a good way to do this.)