Develop Reference

UWP Pushpin ToolTip on click

I added Bing Maps to my UWP View. I have created custom MapItemControl.
I would like to show ToolTip when my pin is clicked.
Here is what I did:
<my:MapControl Name="Map" Center="{Binding Location, Converter={StaticResource LocationToGeopoint}}" ZoomLevel="{Binding ZoomLevel}">
<my:MapItemsControl ItemsSource="{Binding Offers}" >
<my:MapItemsControl.ItemTemplate>
<DataTemplate>
<StackPanel my:MapControl.NormalizedAnchorPoint="0.5,1"
my:MapControl.Location="{Binding Location, Converter={StaticResource LocationToGeopoint}}"
Width="Auto" Height="Auto" >
<Grid Height="25" Width="25" Name="ContentGrid">
<Ellipse Fill="White" Height="Auto" Width="Auto"
Stroke="Red"
StrokeThickness="8"/>
<interactivity:Interaction.Behaviors>
<core:EventTriggerBehavior EventName="PointerPressed">
<core:InvokeCommandAction
CommandParameter="{Binding Id}"
Command="{Binding ElementName=Map, Path=DataContext.PushpinTapped}" />
</core:EventTriggerBehavior>
</interactivity:Interaction.Behaviors>
</Grid>
<Path Data="M33.4916,35.3059 L42.1937,35.3059 L38.1973,40.6036 z" Fill="Red" HorizontalAlignment="Center" Height="6.302" Margin="0,-1,0,0" Stretch="Fill" UseLayoutRounding="False" Width="9.702"/>
<ToolTip Style="{StaticResource MyToolTipStyle}"/>
</StackPanel>
</DataTemplate>
</my:MapItemsControl.ItemTemplate>
</my:MapItemsControl>
</my:MapControl>
Now ToolTip is visible all the time. How can I make it visible only when pin is clicked?

One option may be to use ChangePropertyAction - sample:
<my:MapControl Name="Map" Center="{Binding Location, Converter={StaticResource LocationToGeopoint}}" ZoomLevel="{Binding ZoomLevel}">
<my:MapItemsControl ItemsSource="{Binding Offers}" >
<my:MapItemsControl.ItemTemplate>
<DataTemplate>
<StackPanel my:MapControl.NormalizedAnchorPoint="0.5,1"
my:MapControl.Location="{Binding Location, Converter={StaticResource LocationToGeopoint}}"
Width="Auto" Height="Auto" >
<Grid Height="25" Width="25" Name="ContentGrid">
<Ellipse Fill="White" Height="Auto" Width="Auto"
Stroke="Red"
StrokeThickness="8"/>
<interactivity:Interaction.Behaviors>
<core:EventTriggerBehavior EventName="PointerPressed">
<core:InvokeCommandAction
CommandParameter="{Binding Id}"
Command="{Binding ElementName=Map, Path=DataContext.PushpinTapped}" />
<core:ChangePropertyAction TargetObject="{Binding ElementName=myTooltip}"
PropertyName="Visibility" Value="{Binding ElementName=myTooltip, Path=Visibility, Converter={StaticResource InvertConverter}}"/>
</core:EventTriggerBehavior>
</interactivity:Interaction.Behaviors>
</Grid>
<Path Data="M33.4916,35.3059 L42.1937,35.3059 L38.1973,40.6036 z" Fill="Red" HorizontalAlignment="Center" Height="6.302" Margin="0,-1,0,0" Stretch="Fill" UseLayoutRounding="False" Width="9.702"/>
<ToolTip x:Name="myTooltip" Style="{StaticResource MyToolTipStyle}" Visibility=Collapsed"/>
</StackPanel>
</DataTemplate>
</my:MapItemsControl.ItemTemplate>
</my:MapItemsControl>
</my:MapControl>
You just need to give your ToolTip a name, set its visibility to Collapsed at start and define a converter that will make opposite value of current visibility, so that once user click again, the tooltip will disappear.

Listbox rows are different each time when scroll

I have listbox control with custom data template. I get the collection from webservice and bind that collection to listbox. When i scroll the list box top to bottom my listbox rows are changed and text are concatenate.
Please see the below images
This is my first screen
when scroll top to bottom once again
please compare two images my rows are changed
<Grid Margin="30,20,0,20" x:Name="MeGrid" Loaded="MeGrid_Loaded" Visibility="{Binding Path=_isMyMessage, Converter={StaticResource BoolToVisibilityConverter}}">
<StackPanel >
<TextBlock HorizontalAlignment="Right" Foreground="#00c0d4" Margin="0,0,100,0" Text="{Binding Path=CreatedDate, Converter={StaticResource TimeSinceConverter}}" />
<StackPanel Orientation="Horizontal" HorizontalAlignment="Right">
<Grid Background="#ffffff" Height="auto" Width="auto" MaxWidth="300" MinWidth="50">
<StackPanel Background="White">
<RichTextBox Name="MeRich" Background="White" MaxHeight="600" Foreground="Red"
FontFamily="Segoe UI" Margin="10,0,10,0" VerticalAlignment="Center"
TextWrapping="Wrap" Height="auto"
Width="auto" MinWidth="50"
MaxWidth="300"
local:Properties.Html="{Binding Path=MessageText}">
</RichTextBox>
<readMore:Readmore Source="{Binding Path=MessageText}" Visibility="{Binding ActualHeight,
ElementName=MeRich, Converter={StaticResource ReadMoreVisibilityConverter}}" ></readMore:Readmore>
<!--<TextBlock Margin="10,0,10,0" VerticalAlignment="Center" Foreground="Black" TextWrapping="Wrap" Height="auto" Width="auto" MinWidth="50" MaxWidth="300" Text="{Binding Path=MessageText}"
/>-->
<ListBox ScrollViewer.VerticalScrollBarVisibility="Disabled" ItemsSource="{Binding Path=AttachmentList}">
<ListBox.ItemTemplate>
<DataTemplate>
<Grid Margin="0,5,0,5">
<Button Click="Image_Download" Loaded="Button_Loaded" Tag="{Binding .}" Width="80" Height="80" >
<Button.Template>
<ControlTemplate TargetType="Button">
<Border HorizontalAlignment="Center" VerticalAlignment="Center" >
<ContentControl Content="{TemplateBinding Content}"/>
</Border>
</ControlTemplate>
</Button.Template>
<Image Source="/Resources/Drawable/c_image.png" Tag="{Binding .}" />
</Button>
<ProgressBar VerticalAlignment="Bottom" IsIndeterminate="true" Visibility="Collapsed" Style="{StaticResource CustomIndeterminateProgressBar}" />
</Grid>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
</StackPanel>
</Grid>
<Rectangle Margin="20,0,0,0" VerticalAlignment="Top" RadiusX="50" RadiusY="50" Width="80" Height="80">
<Rectangle.Fill>
<ImageBrush ImageSource="{Binding Path=UserPictureURL}"/>
</Rectangle.Fill>
</Rectangle>
</StackPanel>
</StackPanel>
</Grid>

How to add Lives tiles in Gridview as Data template, as a gridview item

<Models:VariableSizedGridView x:Name="SalesGridview" ItemsSource="{Binding SalesData}" Padding="50,10,0,1000" SelectionChanged="On_selectionChanged" ItemContainerStyle="{StaticResource SalesGridviewitemcustomStyle}" HorizontalAlignment="Left" VerticalAlignment="Top" >
<Models:VariableSizedGridView.ItemTemplate>
<DataTemplate>
<callisto:LiveTile>
<callisto:LiveTile.ItemTemplate>
<DataTemplate>
<Grid VerticalAlignment="Stretch" HorizontalAlignment="Stretch">
<Grid.Background>
<SolidColorBrush Color="{Binding Background}"></SolidColorBrush>
</Grid.Background>
<Button Content="" FontFamily="Segoe UI Symbol" x:Name="flyoutcancel" Command="{Binding DeleteCommand}" Style="{StaticResource CustomSettingsButtonStyle}">
<Button.Flyout>
<Flyout x:Name="EditFlyout" Models:FlyoutHelpers.IsOpen="{Binding IsFlyoutOpen, Mode=TwoWay}" Models:FlyoutHelpers.Parent="{Binding ElementName=flyoutcancel}" Placement="Bottom">
<Grid Background="Transparent" VerticalAlignment="Top" HorizontalAlignment="Left" >
<Grid.RowDefinitions>
<RowDefinition Height="Auto" ></RowDefinition>
<RowDefinition Height="*" ></RowDefinition>
</Grid.RowDefinitions>
<Button Content="" Grid.Row="0" Foreground="White" Command="{Binding DataContext.CancelCommand, ElementName=SalesGridview}" CommandParameter="{Binding }" Style="{StaticResource CustomCancelPopupButtonStyle}" ></Button>
<StackPanel Width="165" Height="200" Grid.Row="1" Background="#334157">
<Button HorizontalAlignment="Left" Height="Auto" Margin="10,10,0,10" Style="{StaticResource CustomCancelPopupButtonStyle}" >
<Button.Content>
<StackPanel Orientation="Horizontal" VerticalAlignment="Center" >
<TextBlock Text="" FontSize="16" VerticalAlignment="Center" Style="{StaticResource SplitViewTextBlockStyle}"></TextBlock>
<TextBlock Text="Widget Settings" Margin="10,3,0,0" FontSize="14" VerticalAlignment="Center" FontFamily="Segeo UI Semibold" Style="{StaticResource SplitViewTextBlockStyle}"></TextBlock>
</StackPanel>
</Button.Content>
</Button>
<Button HorizontalAlignment="Left" Margin="10,0,0,0" Height="Auto" Command="{Binding DataContext.DeleteCommand, ElementName=SalesGridview}" CommandParameter="{Binding Id}" Style="{StaticResource CustomCancelPopupButtonStyle}" >
<Button.Content>
<StackPanel Orientation="Horizontal" VerticalAlignment="Center" >
<TextBlock Text="" FontSize="16" VerticalAlignment="Center" Style="{StaticResource SplitViewTextBlockStyle}"></TextBlock>
<TextBlock Text="Remove Widget" Margin="10,3,0,0" FontSize="14" VerticalAlignment="Center" FontFamily="Segeo UI Semibold" Style="{StaticResource SplitViewTextBlockStyle}"></TextBlock>
</StackPanel>
</Button.Content>
</Button>
</StackPanel>
</Grid>
</Flyout>
</Button.Flyout>
</Button>
</Grid>
</DataTemplate>
</callisto:LiveTile.ItemTemplate>
</callisto:LiveTile>
</DataTemplate>
</Models:VariableSizedGridView.ItemTemplate>
<Models:VariableSizedGridView.ItemsPanel>
<ItemsPanelTemplate>
<VariableSizedWrapGrid VerticalAlignment="Center" Orientation="Horizontal"
ItemHeight="90"
ItemWidth="90">
<VariableSizedWrapGrid.ChildrenTransitions>
<TransitionCollection>
<RepositionThemeTransition></RepositionThemeTransition>
<ReorderThemeTransition></ReorderThemeTransition>
</TransitionCollection>
</VariableSizedWrapGrid.ChildrenTransitions>
</VariableSizedWrapGrid>
</ItemsPanelTemplate>
</Models:VariableSizedGridView.ItemsPanel>
</Models:VariableSizedGridView>
am using above code for a variable sized gridview to show the item, in those items, some of items I want to display as live tiles.
How to bind the data for both Gridview and and Callisto Live tiles items.
Thanks in advance.

WPF Inner Collection virtualization not working

I have implemented below mentioned code in WPF in that I have implemented virtualization of lazy loading but it's not work when my inner collection have a 1000 of record then it will take much time to load on screen.
<ListBox x:Name="Mappingcontrol" Grid.Row="1"
DataContext="{Binding ElementName=Grids,Path=DataContext}"
VerticalAlignment="Stretch" HorizontalAlignment="Stretch"
ItemsSource="{Binding Path=MultiMappingCollectionList, Mode=TwoWay}"
VirtualizingStackPanel.IsVirtualizing="True"
VirtualizingStackPanel.VirtualizationMode="Recycling"
BorderThickness="0" BorderBrush="Transparent"
Background="Transparent"
HorizontalContentAlignment="Stretch"
VerticalContentAlignment="Stretch"
ItemContainerStyle="{StaticResource TransparentListBoxStyle}">
<ListBox.ItemTemplate>
<DataTemplate>
<Border Padding="0,10,0,10" BorderThickness="0,0,0,1"
BorderBrush="{StaticResource Gray5SolidBrush}">
<Grid x:Name="Gridmain" Margin="4,0,0,0">
<Grid.ColumnDefinitions>
<ColumnDefinition x:Name="default" Width="0.5*" SharedSizeGroup="default" />
<ColumnDefinition x:Name="atrioValue" Width="1*"
SharedSizeGroup="atrioValue" />
<ColumnDefinition x:Name="externalValue" Width="2*"
SharedSizeGroup="externalValue" />
</Grid.ColumnDefinitions>
<ToggleButton VerticalAlignment="Top"
HorizontalAlignment="Left"
Style="{DynamicResource ToggleButtonStyle}"
Margin="30,12,10,10" IsTabStop="False" Width="25"
Height="25"
IsChecked="{Binding IsDefault, Mode=TwoWay}">
<TextBlock Grid.Column="1" Margin="0,15,10,10" HorizontalAlignment="Left"
VerticalAlignment="Top"
Text="{Binding Path=Description}"
Style="{StaticResource ContentDataText}"
Name="txtDescription" />
<ListBox x:Name="GroupListBox" Grid.Column="2"
ItemsSource="{Binding Path=MultiMapping,Mode=TwoWay}"
HorizontalContentAlignment="Stretch"
BorderThickness="0"
BorderBrush="Transparent"
Background="Transparent"
VerticalContentAlignment="Stretch"
VirtualizingStackPanel.IsVirtualizing="True"
VirtualizingStackPanel.VirtualizationMode="Recycling"
VirtualizingStackPanel.CacheLength="2,3"
VirtualizingStackPanel.CacheLengthUnit="Page"
ItemContainerStyle="{StaticResource TransparentListBoxStyle}">
<ListBox.ItemTemplate>
<DataTemplate>
<StackPanel Orientation="Horizontal" CanVerticallyScroll="True" Height="200">
<telerik:RadWatermarkTextBox x:Name="ExternalValueTextBox"
HorizontalAlignment="Left"
TabIndex="100"
KeyboardNavigation.TabIndex="100"
IsTabStop="True"
Width="250"
MaxLength="35"
TextWrapping="Wrap"
Validation.ErrorTemplate="{DynamicResource CustomErrorTemplate}"
Text="{Binding Path=ExternalValue, Mode=TwoWay,UpdateSourceTrigger=PropertyChanged}"
PreviewTextInput="ExternalValueTextBox_OnPreviewTextInput"
Style="{DynamicResource RadWatermarkTextBoxDefault}"
Visibility="{Binding Path=ExternalValue,Converter={StaticResource StarVisibilityConverter}}"
Margin="0,5,0,0">
</telerik:RadWatermarkTextBox>
<Button x:Name="DeleteButton" Background="Transparent"
BorderThickness="0"
BorderBrush="Transparent"
CommandParameter="{Binding}"
Command="{Binding DataContext.RemoveGrouplistCommand, RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type UserControl}}}"
HorizontalAlignment="Right"
VerticalAlignment="Center"
Visibility="{Binding Path=RemoveButtonVisibility,Converter={StaticResource BooleanHiddenVisibleConverter},Mode=TwoWay}"
Margin="15,5,15,0"
Style="{DynamicResource ButtonInvisibleNoColorEffects}">
<Button.Content>
<Rectangle Style="{StaticResource SmallCloseIcon}" />
</Button.Content>
</Button>
<Grid x:Name="AddGrid"
Visibility="{Binding Path=AddbuttonVisibility,Converter={StaticResource BooleanVisibilityConverter}}">
<controls:ActionImageButton x:Name="AddButton"
Content="Add Another"
DataContext="{Binding ElementName=Root,Path=DataContext}"
CommandParameter="{Binding ElementName=txtDescription,Path=Text}"
Command="{Binding AddGrouplistCommand}"
HorizontalAlignment="Right"
VerticalAlignment="Center"
IsEnabled="{Binding ElementName=ExternalValueTextBox,Path=Text,Converter={StaticResource StarVisibilityConverter},ConverterParameter=CanAdd}"
Margin="5,5,30,5"
Style="{StaticResource ActionImageButtonMedium}" />
</Grid>
</StackPanel>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
</Grid>
</Border>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
It would be great help if anyone can light on me what's I am doing wrong in it
Thanks in advance.

How do I cycle through records in an XML file using previous/next buttons?

I'm new to C# programming so here goes..
I'm trying to write an electronic scrapbook application as a present but I've come unstuck - my application currently shows the first xml record but I don't know how to use the next button to go to the next record. I've tried experimenting with arrays and arraylists but I can't seem to get anywhere near what I'm looking for. Any help would be hugely appreciated :-)
I'll include my XML and XAML code below but I'll leave out the C# code as it'll make my post too long. Apologies if any of the code below is irrelevant to you:
XAML:
<Grid>
<Grid.DataContext>
<XmlDataProvider Source="Data/Memories.xml" XPath="/Memories/Memory" />
</Grid.DataContext>
<DockPanel Height="22" Name="dockPanel1" HorizontalAlignment="Stretch" VerticalAlignment="Top" Width="Auto">
<Menu Height="24" Name="menu1" Width="Auto" DockPanel.Dock="Top" VerticalAlignment="Top">
<MenuItem Header="_File" >
<MenuItem Header="Add _New Memory" Name="newMemory" Click="newMemory_Click" />
<MenuItem Header="_Edit this Memory" Name="editMemory" Click="editMemory_Click" />
<MenuItem Header="_Delete this Memory" Name="deleteMemory" Click="deleteMemory_Click" />
<MenuItem Header="_Save Changes" Name="saveMemory" Click="saveMemory_Click" />
<Separator/>
<MenuItem Header="E_xit" Name="exit" Click="exit_Click" />
</MenuItem>
<MenuItem Header="_Edit" />
<MenuItem Header="_Help" >
<MenuItem Header="_About muh program" Name="about" Click="about_Click" />
</MenuItem>
</Menu>
</DockPanel>
<Button Content="<" Margin="-70,32,0,0" Name="previousButton" Height="22" Width="20" VerticalAlignment="Top" Visibility="{Binding IsEnabled, ElementName=newMemory, Converter={StaticResource VisibleIfTrue}}" />
<Button Content=">" Height="22" Margin="70,32,0,0" Name="nextButton" Width="20" VerticalAlignment="Top" Visibility="{Binding IsEnabled, ElementName=newMemory, Converter={StaticResource VisibleIfTrue}}" />
<Button Content="?" Margin="0,32,0,0" Name="RandomButton" Height="22" Width="40" VerticalAlignment="Top" Visibility="{Binding IsEnabled, ElementName=newMemory, Converter={StaticResource VisibleIfTrue}}" />
<TextBlock Height="30" Width="300" Margin="0,62,0,419" TextAlignment="Center" Text="{Binding XPath=#Title}" FontSize="15" FontWeight="Bold" Name="memoryTitle" />
<TextBlock Height="30" Width="300" Margin="0,84,0,397" TextAlignment="Center" Text="{Binding XPath=./Date}" FontSize="12" FontWeight="Normal" Name="memoryDate" Panel.ZIndex="1" />
<TextBlock Height="375" HorizontalAlignment="Right" Margin="0,116,26,20" Name="textOutput" Width="300" TextWrapping="Wrap" TextAlignment="Center" Background="White" Visibility="{Binding IsEnabled, ElementName=newMemory, Converter={StaticResource VisibleIfTrue}}">
<TextBlock.Text>
<Binding XPath="./Blurb" />
</TextBlock.Text>
</TextBlock>
<TextBox HorizontalAlignment="Right" Margin="0,116,26,20" Name="textInput" Height="375" Width="300" TextWrapping="Wrap" AcceptsReturn="True" Visibility="{Binding IsEnabled, ElementName=newMemory, Converter={StaticResource VisibleIfNotTrue}}" />
<Image Height="375" HorizontalAlignment="Center" Margin="-326,94,0,0" Name="imgPhoto" Stretch="Uniform" VerticalAlignment="Center" Width="500" ClipToBounds="False" AllowDrop="False" Source="{Binding XPath=ImageFile}" />
<Image Height="375" HorizontalAlignment="Center" Margin="-326,94,0,0" Name="imgPhotoNew" Stretch="Uniform" VerticalAlignment="Center" Width="500" ClipToBounds="False" AllowDrop="False" Visibility="{Binding IsEnabled, ElementName=newMemory, Converter={StaticResource VisibleIfNotTrue}}" />
<Button Content="Done" Height="22" Width="40" Margin="463,32,375,0" Name="doneMemoryButton" VerticalAlignment="Top" Click="doneMemoryButton_Click" Visibility="{Binding IsEnabled, ElementName=newMemory, Converter={StaticResource VisibleIfNotTrue}}" />
<Button Content="Select Photo" Height="22" Width="75" Margin="377,32,427,0" Name="selectPhotoButton" VerticalAlignment="Top" HorizontalAlignment="Center" Click="selectPhotoButton_Click" Visibility="{Binding IsEnabled, ElementName=newMemory, Converter={StaticResource VisibleIfNotTrue}}" />
</Grid>
XML:
<Memories>
<Memory Title="1 Year - Howard Jones!" ID="1">
<ImageFile>Data/Images/01.jpg</ImageFile>
<Blurb>We saw Howard Jones perform!!</Blurb>
<Date>06/11/2010</Date>
</Memory>
<Memory Title="Ski Holiday" ID="2">
<ImageFile>Data/Images/02.jpg</ImageFile>
<Blurb>Our skiing holiday in Flaine!</Blurb>
<Date>29/11/2010</Date>
</Memory>
<Memory Title="Stinksy's Birthday: Ice Bar!" ID="3">
<ImageFile>Data/Images/03.jpg</ImageFile>
<Blurb>Absolut Ice Bar</Blurb>
<Date>19/12/2010</Date>
</Memory>
</Memories>

I will not work through that code but i can give you a simple example of how to do this:
<Window.Resources>
<XmlDataProvider x:Key="data" Source="Data/Memories.xml" XPath="/Memories/Memory" />
<CollectionViewSource x:Key="dataCvs" Source="{StaticResource data}" />
</Window.Resources>
<StackPanel>
<ContentControl Content="{Binding Source={StaticResource dataCvs}}">
<ContentControl.ContentTemplate>
<DataTemplate>
<StackPanel>
<Image Source="{Binding XPath=ImageFile}" />
<TextBlock Text="{Binding XPath=Blurb}" />
<TextBlock Text="{Binding XPath=Date}" />
</StackPanel>
</DataTemplate>
</ContentControl.ContentTemplate>
</ContentControl>
<Button Content="Previous" Click="Previous_Click" Tag="{StaticResource dataCvs}" />
<Button Content="Next" Click="Next_Click" Tag="{StaticResource dataCvs}" />
</StackPanel>
The ContentControl binds to the CurrentItem of the view on top of the memories collection, i pass the CollectionViewSource to the Buttons so i can change the current item on click. (Normally you should use a Command and pass it as CommandParameter instead, that is cleaner)
private void Next_Click(object sender, RoutedEventArgs e)
{
var button = (Button)sender;
var cvs = (CollectionViewSource)button.Tag;
cvs.View.MoveCurrentToNext();
}
private void Previous_Click(object sender, RoutedEventArgs e)
{
var button = (Button)sender;
var cvs = (CollectionViewSource)button.Tag;
cvs.View.MoveCurrentToPrevious();
}