I'm using this datatemplate for my app , which used context menu from WP8 toolkit . So each item in this datatemplate has a button (to open context menu) and context menu also has click events
So when I use this datatemplate for my LongListSelectors in app, how can I call these click events?
<DataTemplate>
<Grid>
<Grid.ColumnDefenitions>.........
......
<TextBlock Text="{Binding Name}" TextWrapping="Wrap" Grid.Column="0"/>
<TextBlock Text="{Binding Artist}" TextWrapping="Wrap" Grid.Column="1"/>
<Button Click="openContext" Grid.Column="2"/>
<toolkit:ContextMenuService.ContextMenu>
<toolkit:ContextMenu IsZoomEnabled="false">
<toolkit:MenuItem Header="Download"
Click="context_download" />
<toolkit:MenuItem Header="Add to later"
Click="context_later" />
.......
</toolkit:ContextMenu>
</toolkit:ContextMenuService.ContextMenu>
</TextBlock>
</StackPanel>
</DataTemplate>
Context menu should be declared inside the element and not separately. Declare your context menu inside your button like below code and remove the click event in your button.
Whenever you declare context menu in your button, it works automatically (opens context menu) without any click event.
<Button Content="ContextMenu">
<toolkit:ContextMenuService.ContextMenu>
<toolkit:ContextMenu IsZoomEnabled="False">
<toolkit:MenuItem Header="Download" Click="context_download"/>
<toolkit:MenuItem Header="Add to later" Click="context_later"/>
</toolkit:ContextMenu>
</toolkit:ContextMenuService.ContextMenu>
</Button>
Related
The background window is not darkened when DialogHost is called, meaning the dialog is not modal. The back window remains active. Although in the Github example works correctly. I don't know where I'm going.
XAML:
<materialDesign:DialogHost x:Name="DH_getLoadingList"
HorizontalAlignment="Center"
VerticalAlignment="Center"
CloseOnClickAway="True"
OverlayBackground="{DynamicResource PrimaryHueDarkBrush}" DialogTheme="Inherit" Grid.RowSpan="5" Grid.ColumnSpan="5">
<materialDesign:DialogHost.DialogContent>
<StackPanel Margin="16" Orientation="Vertical">
<Label Content="The row will be deleted." FontSize="16" />
<StackPanel Orientation="Horizontal">
<Button Content="OK" Style="{DynamicResource MaterialDesignFlatButton}" IsDefault="True" Margin="0,8,8,0" />
<Button Content="Cancel" Style="{DynamicResource MaterialDesignFlatButton}" Margin="0,8,8,0" />
</StackPanel>
</StackPanel>
</materialDesign:DialogHost.DialogContent>
</materialDesign:DialogHost>
C# code:
private void GettingFuelListCommand_Executed(object sender, ExecutedRoutedEventArgs e)
{
DH_getLoadingList.IsOpen = true;
}
UPDATED
I just had a misunderstanding the DialogHost structure. The correct way is
<Window>
<materialDesign:DialogHost>
<materialDesign:DialogHost.DialogContent>
<--! dialog content ... -->
</materialDesign:DialogHost.DialogContent>
<--! the correct location of the page content ... -->
</materialDesign:DialogHost>
<--! incorrect location of the page content ... -->
<Window/>
I know this is more than a year late. But when you put these properties:
HorizontalAlignment="Center"
VerticalAlignment="Center"
The overlay background will not appear, if you remove these, the problem will go away. The dialog will always be centered so don't need to worry about it's relative position to it's parent container.
I've made a Toggle, which expands a Popup window with a ListBox inside. It looks like so:
<ToggleButton Name="Toggle" Height="20" Width="150" >
<StackPanel>
<TextBlock Text="TestListPopup"/>
<Popup Height="200" Width="150"
IsOpen="{Binding ElementName=Toggle, Path=IsChecked}"
PlacementTarget="{Binding ElementName=Toggle}"
HorizontalAlignment="Left"
VerticalAlignment="Bottom">
<ListBox SelectionMode="Multiple" SelectionChanged="TypeSelectionChanged" >
<ListBoxItem Content="Test1"/>
<ListBoxItem Content="Test2"/>
<ListBoxItem Content="Test3"/>
</ListBox>
</Popup>
</StackPanel>
</ToggleButton>
It works perfectly, but I want to use it inside the FilterRow of my xceed DataGrid here:
<xcdg:DataGridControl x:Name="dataGrid"
ItemsSource="{Binding Source={StaticResource DataSource}}">
<xcdg:DataGridControl.View>
<xcdg:TableflowView>
<xcdg:TableflowView.FixedHeaders>
<DataTemplate>
<xcdg:ColumnManagerRow/>
</DataTemplate>
<DataTemplate>
<xcdg:FilterRow>
<xcdg:FilterCell FieldName="Name" IsEnabled="True"/>
<xcdg:FilterCell FieldName="Type" IsEnabled="True">
<!-- TestListPopup control here -->
</xcdg:FilterCell>
</xcdg:FilterRow>
</DataTemplate>
</xcdg:TableflowView.FixedHeaders>
</xcdg:TableflowView>
</xcdg:DataGridControl.View>
<xcdg:DataGridControl.Columns>
<xcdg:Column FieldName="Name" Title="Name" />
<xcdg:Column FieldName="Type" Title="Type" Width="160"/>
</xcdg:DataGridControl.Columns>
</xcdg:DataGridControl>
In here though, the popup will not bind to the toggle button. Pressing the toggle button doesn't do anything.
I narrowed it down to the binding being broken, because if you set IsOpen="True", it's open (and not adhering to PlacementTarget), but again; it works perfectly outside of the DataGrid..
Why does a perfectly functional control break once put inside the FilterRow?
Any help is appreciated! :)
Why does a perfectly functional control break once put inside the FilterRow?
Because the ToggleButton and the FilterCell don't belong to the same namescope.
You may try to bind using an x:Reference:
IsOpen="{Binding Path=IsChecked, Source={x:Reference Toggle}}"
The other option would be to bind the IsChecked property of the ToggleButton to a bool property of a view model and also bind the IsOpen property of the Popup to the same source property. Make sure that the view model implements the INotifyPropertyChanged interface and raise change notifications when the source property is set.
As the title says, I would like the first nested Button to be selected (this button selects a view) when the tab item is clicked. Here is my code below:
<TabItem Header="Scheduling">
<StackPanel Style="{StaticResource ResourceKey=TabStackPanelStyle}">
<RadioButton Command="{Binding BookResourceCommand}" Style="{StaticResource ResourceKey=TabButtonStyle}">Book</RadioButton>
<RadioButton Command="{Binding NewResourceCommand}" Style="{StaticResource ResourceKey=TabButtonStyle}">New</RadioButton>
<RadioButton Command="{Binding EditResourceCommand}" Style="{StaticResource ResourceKey=TabButtonStyle}">Edit</RadioButton>
<RadioButton Command="{Binding DeleteResourceCommand}" Style="{StaticResource ResourceKey=TabButtonStyle}">Delete</RadioButton>
</StackPanel>
</TabItem>
This TabItem sits in a TabControl with a few more similar TabItems. All I want to do is have the TabItem select the first RadioButton (by default) when it is clicked. These radio buttons change a user control in my ViewModel.
I know it would be possible using EventTriggers associated with the TabItem but there must be a better way.
Thanks!
I think in this situation you can use Binding:
TabItem
<TabItem x:Name="MyTabItem" Header="Two">
<Label Content="Some Content" />
</TabItem>
RadioButton
<RadioButton Name="MyButton" Content="Two" IsChecked="{Binding ElementName=MyTabItem, Path=IsSelected}" />
If you want to be when you click on the RadioButton, the tab is not selected, use Mode=OneWay:
<RadioButton Name="MyButton" IsChecked="{Binding ElementName=MyTabItem, Path=IsSelected, Mode=OneWay}" />
I have the following XAML:
<phone:LongListSelector.ItemTemplate>
<DataTemplate>
<StackPanel Margin="0,0,0,17" >
<TextBlock Text="{Binding Path=Name, Mode=TwoWay}" TextWrapping="Wrap" Style="{StaticResource PhoneTextExtraLargeStyle}" />
<TextBlock Text="{Binding Path=State.Summary, Mode=TwoWay}" TextWrapping="Wrap" Margin="12,-6,12,0" Style="{StaticResource PhoneTextSubtleStyle}"/>
<toolkit:ToggleSwitch x:Name="stateToggle" x:Uid="{Binding Path=Id, Mode=TwoWay}" IsChecked="{Binding Path=State.Current, Mode=TwoWay}" Click="stateToggle_Click_1" ></toolkit:ToggleSwitch>
</StackPanel>
</DataTemplate>
</phone:LongListSelector.ItemTemplate>
I am trying to achieve the following:
1) Take an action on toggle switch click (handle an event)
2) Take an action when an item from the list is tapped i.e. outside the borders of the toggle switch.
I have tried SelectionChanged and ToggleSwitch Click but that way I still invoke both events when the toggle switch is clicked.
Any ideas?
If SelectionChanged works for use case 2, then you are basically there.
You should set the MouseEventArgs Handled property to true in your ToggleSwitch Click handler. That way the selection should not be changed (because the listitem has not been clicked) and only the click event you want should be raised.
I would like to know how to construct the ListBox in WP7 that only load 20 items at a single time, and have a footer that show "load more" if there is any.
When user press the "load more", it will load another 20 in the list without loading the previous loaded data?
I am using LINQ at the behind source.
my code for XMAL as follow:
<Grid>
<ListBox name="newsIndexListBoxEN">
<ListBoxItem>
<DataTemplate>
<StackPanel Width="410" Orientation="Horizontal" VerticalAlignment="Top" Margin="0,5,0,5">
<StackPanel Background="DarkBlue" Margin="10,0,0,0" Height="100" Width="100" VerticalAlignment="Top">
<TextBlock Name="columnsTypeTB" Text="{Binding pType}" Margin="0,0,0,0" Foreground="White" FontSize="23" HorizontalAlignment="Center" />
<Image Width="100" Height="100" VerticalAlignment="Top" HorizontalAlignment="Center" Source="Background.png" />
</StackPanel>
<StackPanel Width="300" Height="100" Margin="0,0,0,0">
<Path Margin="0,0,0,0" Data="M39,8 L389,8" Fill="DarkBlue" Height="1" Stretch="Fill" Stroke="DarkBlue" UseLayoutRounding="False" Width="400"/>
<TextBlock Margin="8,0,0,0" Text="{Binding pTitle}" Tag="{Binding pID}" Style="{StaticResource PhoneTextNormalStyle}" TextWrapping="Wrap" Width="292" Height="66" />
<TextBlock Margin="8,5,0,0" Text="{Binding pDate}" Tag="{Binding pID}" MouseEnter="NewsViewContent_mouseEnter" Style="{StaticResource PhoneTextSmallStyle}" VerticalAlignment="Bottom" TextWrapping="Wrap" Width="292" />
</StackPanel>
</StackPanel>
</DataTemplate>
</ListBoxItem>
</ListBox>
</Grid>
C# Code as follow:
using (IsolatedStorageFile storage = IsolatedStorageFile.GetUserStoreForApplication())
{
using (IsolatedStorageFileStream fs = storage.OpenFile(fileName, FileMode.Open))
{
XDocument menuIndex = XDocument.Load(fs);
var menuIndexList = from query in menuIndex.Descendants("news")
orderby (int)query.Element("newsID") descending
select new mkmenu
{
pID = query.Element("newsID").Value,
pTitle = query.Element("newsTitle").Value,
pDate = query.Element("newspDate").Value,
pType = newsType
};
newsIndexListBoxEN = menuIndexList.Count();
}
}
any ideas? sample code?
You can edit your listbox template to show a "Load more" button at the end of the list. In Blend, right click on your listbox, choose Edit Template, Edit a copy. By default, your listbox has a template like this:
ScrollViewer
ItemPresenter
Wrap your ItemPresenter into a StackPanel, then add a button at the end:
ScrollViewer
StackPanel
ItemPresenter
Button
That button will always be displayed at the end of the listbox. Handle the Clicked event of that button to add items to your ObservableCollection.
You can bind your listbox to ObservableCollection and add first 20 items on your page(app) load. Than after pressing "load more" get next 20 items and add to collection. Items will automatically be added to listbox.