Oxyplot: disable tracker - wpf

I have several series, and I need to disable tracker for some of them only. How do I do that?
<oxy:Plot.Series>
<oxy:AreaSeries ItemsSource="{Binding PowerValues}" Smooth="False" StrokeThickness="1" Foreground="#6B303030" Color="White" Color2="#00000000"
Fill="{StaticResource FillColor}" BrokenLineColor="Red"></oxy:AreaSeries>
<oxy:StairStepSeries ItemsSource="{Binding PowerTemplateMax}" Smooth="False" StrokeThickness="2" Color="Green" IsManipulationEnabled="False">
</oxy:StairStepSeries>
<oxy:StairStepSeries ItemsSource="{Binding PowerTemplateMin}" Smooth="False" StrokeThickness="2" Color="Yellow"></oxy:StairStepSeries>
</oxy:Plot.Series>
AreaSeries should have the trakcer, when both StairStepSeries should not.

One way to achieve this using a Custom Tracker, which is invisible. For example, You could define your tracker as.
<oxy:PlotView.TrackerDefinitions>
<oxy:TrackerDefinition TrackerKey="InvisibleTracker">
<oxy:TrackerDefinition.TrackerTemplate>
<ControlTemplate>
<TextBlock Text="{Binding}" Visibility="Collapsed"/>
</ControlTemplate>
</oxy:TrackerDefinition.TrackerTemplate>
</oxy:TrackerDefinition>
</oxy:PlotView.TrackerDefinitions>
Notice you have set the visibility of TextBlock as Collapsed. You can now set the TrackerKey for the series for which you need to hide the Tracker to "InvisibleTracker". This would ensure tracker is not visible for those series.

Related

Validation.ErrorTemplate size

I've got the following control template which I use as a Validation.ErrorTemplate for TextBoxes:-
<ControlTemplate x:Key="ControlValidationErrorTemplate">
<DockPanel LastChildFill="True">
<Border Background="Red"
DockPanel.Dock="right"
Padding="2,0,2,0"
ToolTip="{Binding ElementName=valAdorner, Path=AdornedElement.(Validation.Errors), Converter={x:Static val:ValidationErrorsConverter.Instance}}">
<TextBlock Text="!"
VerticalAlignment="center"
HorizontalAlignment="center"
FontWeight="Bold"
Foreground="white" />
</Border>
<AdornedElementPlaceholder x:Name="valAdorner"
VerticalAlignment="Center">
<Border BorderBrush="red"
BorderThickness="1" />
</AdornedElementPlaceholder>
</DockPanel>
</ControlTemplate>
When a TextBox contains invalid content, the above template applies a red border and adds a red box containing an exclamation mark immediately to the right of the TB.
The problem is, the exclamation mark overlaps anything immediately to the right of the TB, rather than the layout changing to accomomodate the exclamation mark. I have a similar problem in DataGrids - the exclamation mark overlaps the right-hand edge of the containing cell, rather than the column width increasing to accommodate it.
Using Snoop, it appears that the template is being displayed in an "adorner layer" which I assume is a separate visual tree? This would explain why the window's layout isn't recalculated to take into account the exclamation mark. Can anyone suggest a way to achieve what I want?
As I suspected, it's due to the error template being rendered on the adorner layer, so it doesn't affect the layout of the window. See: http://social.msdn.microsoft.com/Forums/en-US/wpf/thread/9de3c9e5-5759-4f88-9184-175d3eaabdad/
I'm now using this control template instead:-
<ControlTemplate x:Key="ControlValidationErrorTemplate">
<Grid>
<Polygon Points="9,9 9,0 0,0"
Stroke="Red"
StrokeThickness="1"
Fill="Red"
HorizontalAlignment="Right"
VerticalAlignment="Top"
ToolTip="{Binding ElementName=valAdorner, Path=AdornedElement.(Validation.Errors), Converter={x:Static val:ValidationErrorsConverter.Instance}}" />
<AdornedElementPlaceholder x:Name="valAdorner"
VerticalAlignment="Center">
<Border BorderBrush="red"
BorderThickness="1" />
</AdornedElementPlaceholder>
</Grid>
</ControlTemplate>
This draws a red border around the control, with a small red triangle overlapping the top-right corner of the control - hovering over this displays a tooltip containing the error message.

Control to use for Reusable container for content/content template?

I am creating a container whose style will be used across the application. It essentially is a 'pop up' but won't spawn in a new window. The general structure of my app is one NavigationWindow and many pages. So I get started with the following Template, defined in my Resource Dictionary:
<ControlTemplate x:Key="RainbowModalTemplate" TargetType="{x:Type Control}">
<Canvas Height="540" Canvas.Left="492" Canvas.Top="296" Width="945">
<Border x:Name="Modal" Height="540" Width="945" Background="#ec2016" BorderBrush="White" BorderThickness="2" CornerRadius="15" Style="{DynamicResource RainbowModalBox}">
<Border.Clip>
<RectangleGeometry RadiusX="15" RadiusY="15" Rect="0,0,945,540"/>
</Border.Clip>
<Image Source="Resources/RainbowModal/rainbow.png" Height="247" Width="947" Margin="0,0,0,0" VerticalAlignment="Bottom" d:LayoutOverrides="Height" Stretch="UniformToFill" Canvas.Left="-2" Canvas.Top="293" ClipToBounds="True" />
</Border>
</Canvas>
</ControlTemplate>
So when I want to 'consume' this, I want to be able to implement this control but provide my own content inside, (buttons, text, etc). However because I am new to WPF I am unsure what control or controls to use, and what structure to lay this out as. Below is sample 'consumer' of the object. Someone will click a button in the application and that will set this objects' visibility to be Visible :
<Control x:Name="RequestMoreInfoModal" Template="{DynamicResource RainbowModalTemplate}" Canvas.Left="494" Canvas.Top="250" Visibility="Collapsed"></Control>
I know this probably isn't the most kosher way to do this, so I am open to suggestion. My specific concerns:
I know "Control" isn't the right type. But I don't know what is appropriate and it appears Canvas and other controls do not allow Templating. What control should I use?
how do I implement this Template and also allow the consumer to define their own content within the Template?
What I eneded up doing is using a ControlTemplate and ContentPresenter.
Here is the definition of the reusable content in my ResourceDictionary:
<ControlTemplate x:Key="RainbowModal" TargetType="ContentControl">
<Canvas>
<Border x:Name="Modal" Height="540" Width="945" Background="#ec2016" BorderBrush="White" CornerRadius="15" BorderThickness="2" Style="{DynamicResource RainbowModalBox}">
<Border.Clip>
<RectangleGeometry
RadiusX="{Binding CornerRadius.TopLeft, RelativeSource={RelativeSource AncestorType={x:Type Border}}}"
RadiusY="{Binding RadiusX, RelativeSource={RelativeSource Self}}"
Rect="0,0,945,540"/>
</Border.Clip>
<Canvas>
<Image Source="Resources/RainbowModal/rainbow.png" Height="247" Width="947" Margin="0,0,0,0" VerticalAlignment="Bottom" Stretch="UniformToFill" Canvas.Left="-2" Canvas.Top="293" ClipToBounds="True" />
<ContentPresenter/>
</Canvas>
</Border>
</Canvas>
</ControlTemplate>
And here is the 'consumption' of that content.
<ContentControl x:Name="RequestMoreInfoModal" Canvas.Left="489" Canvas.Top="122" Template="{StaticResource RainbowModal}" Visibility="Collapsed">
<Canvas>
<TextBlock FontSize="78" Foreground="White" Width="903" Canvas.Top="28" Canvas.Left="20" Height="298" Text="Scan your card to receive an email with more information." TextWrapping="Wrap" FontFamily="Serif72 Beta" TextAlignment="Center" />
<Button Width="250" Height="76" Content="CLOSE" Margin="350,350" Style="{DynamicResource PurpleInfoButton}" FontSize="28" Click="Button_Click_1" ></Button>
</Canvas>
</ContentControl>

Create selectable pushpin in Bing maps (XAML)

This is more of XAML question for silverlight.
<Mobile:DevicePushpinTemplateSelector
m:MapLayer.Position="{Binding Location}"
ZoomLevel="{Binding ZoomLevel, ElementName=MainMap}"
Content="{Binding}">
<Mobile:DevicePushpinTemplateSelector.DotTemplate>
<DataTemplate>
<Ellipse Width="8" Height="8" Stroke="Black" Fill="{Binding IsGPSDataRecent, Converter={StaticResource BoolToGreenRedBrushConverter}}" StrokeThickness="1">
<ToolTipService.ToolTip>
<TextBlock Text="{Binding DisplayId}" />
</ToolTipService.ToolTip>
</Ellipse>
</DataTemplate>
</Mobile:DevicePushpinTemplateSelector.DotTemplate>
<Mobile:DevicePushpinTemplateSelector.NumberedTemplate>
<DataTemplate>
<Border x:Name="border" Background="{Binding IsGPSDataRecent, Converter={StaticResource BoolToGreenRedBrushConverter}}" BorderBrush="Black" BorderThickness="2" Padding="2" Height="20" CornerRadius="8">
<TextBlock VerticalAlignment="Center" Text="{Binding DisplayId}" />
</Border>
</DataTemplate>
</Mobile:DevicePushpinTemplateSelector.NumberedTemplate>
</Mobile:DevicePushpinTemplateSelector>
On XAML above I have 2 different templates based on map zoom level. When it is zoomed out - it shows smaller ellipse, when user zooms closer - I increase size of pushpin.
2 issues:
WIth a lot of pushpins it get's really slow, I beleive it's due to template selection.
I want it to be different. I want to create "IsSelected" property so all pushpins will be the same on all zoom levels but when user clicks on pushpin - it expands in size.
I wonder how do I code "selection" part. I want only one pushpin to be selected at time. I can bind to property and make pushpin parts visible/invisible but I'm not sure how to code "selection" piece. Should it be Button?
When doing a windows phone app I had the issue of many pins causing "lag" the easiest way around that is to only show pins within a certain radius of the centre of the map and remove the others until they come into the radius.
Cheers
Mark

DropShadowEffect applying to child elements - Silverlight XAML

I have an ItemsControl which contains some nested containers. I want to add a dropshadow around each element of the main ItemsControl. But instead it is adding it to certain containers that are within the main ItemsControl (creating rows of shadows). I have placed the effect at a number of different levels but it results in no change. I started out with the outermost container of the item within the main ItemsControl and went upward from there.
Here is where I currently have the effect for the drop shadow placed:
<ItemsControl >
<ItemsControl.ItemsPanel>
<ItemsPanelTemplate>
<!-- I have tried adding the dropshadow effect within this stackpanel -->
<StackPanel />
</ItemsPanelTemplate>
</ItemsControl.ItemsPanel>
<!-- Where I define the dropshadow -->
<ItemsControl.Effect>
<DropShadowEffect BlurRadius="0" ShadowDepth="1" Color="LightGray"/>
</ItemsControl.Effect>
<!-- End of dropshadow definition -->
<ItemsControl.ItemTemplate>
<DataTemplate>
<media:Step5Item />
</DataTemplate>
</ItemsControl.ItemTemplate>
</ItemsControl>
And here is the definition for Step5Item, I added documentation for where the shadows are appearing: (edit) I removed the content for the elements since that was just styling and so forth.
<!-- This is inserted by the above code's DataTemplate -->
<!-- I have tried adding a border here and giving it a dropshadow effect -->
<Grid >
<!-- I have tried inserting a dropshadow effect here -->
<TextBlock Grid.Row="0"/>
<Border BorderBrush="LightGray" BorderThickness="1" >
<!-- I have tried inserting a dropshadow effect here -->
<Grid>
<Border >
<!-- There is a shadow around this border/grid -->
<Grid Grid.Row="0" >
<TextBlock Grid.Column="0" />
<Button Grid.Column="2"/>
</Grid>
</Border>
<!--There is a shadow around each element in this ItemsControl-->
<ItemsControl Grid.Row="2" >
<ItemsControl.ItemTemplate>
<DataTemplate>
<Grid Margin="0,0,0,4" >
<Path Grid.Row="0">
<Path.Data>
<LineGeometry StartPoint="0,0" EndPoint="1500,0"/>
</Path.Data>
</Path>
<Grid Grid.Row="1">
<Image Grid.Column="0" />
</Grid>
</Grid>
</DataTemplate>
</ItemsControl.ItemTemplate>
</ItemsControl>
</Grid>
</Border>
</Grid>
There is also a shadow at the bottom but I don't know if its from the last element in the ItemsControl or if it is from the outer most border.
If you'd like I can clean up the second code piece more. I took out some stuff but left in the elements, thinking that might be best for readability.
EDIT
I tried applying the effect after I add the child elements hoping that since they would be created before the effect went into play that the problem would not occur. I tried placing the effect at the bottom of both the main ItemsControl as well as at the bottom of the outermost grid in Step5Item. I have also removed some content from Step5Item to make it hopefully more readable.
EDIT2
Here are two images with and without the effect. I left the DropShadow code exactly where I placed it above, though like I said, I can place it in many places to get the same effect.
With Dropshadow
Without Dropshadow
Without Error http://img402.imageshack.us/img402/1456/nodropshadowexample.png
Edit 3
This is the border and drop shadow effect that I am using from Erno's solution. I am hoping to be able to increase the shadowdepth some more because the right side is not getting any shadow, only the bottom. Currently if I change ShadowDepth it changes to location of the shadow to be at a distance away equal to the new size but it is only a thickness of 1.
<Border Margin="0,1,0,0" Height="auto" Width="auto" CornerRadius="5,5,5,5" BorderThickness="1" BorderBrush="LightGray">
<Border.Effect>
<DropShadowEffect BlurRadius="0" ShadowDepth="1" Direction="315" Color="LightGray"/>
</Border.Effect>
</Border>
Have you tried to do the following?
I added another Grid and added a SIBLING Border with the effect. The grid containing the rows is displayed on top of it but is NOT a child control of the Border.
<ItemsControl Grid.Row="2" >
<ItemsControl.ItemTemplate>
<DataTemplate>
<Grid Margin="0,0,0,4" >
<Grid>
<Border>
<Border.Effect>
<DropShadow />
</Border.Effect>
</Border>
<Path Grid.Row="0">
<Path.Data>
<LineGeometry StartPoint="0,0" EndPoint="1500,0"/>
</Path.Data>
</Path>
<Grid Grid.Row="1">
<Image Grid.Column="0" />
</Grid>
</Grid>
</Grid>
</DataTemplate>
</ItemsControl.ItemTemplate>
</ItemsControl>

Clipping Path on an ImageBrush in Silverlight

Is there a way to put a clipping path on an ImageBrush in Silverlight (not an Image)? I don't see it available from Intellisense, but I'm wondering if there may be a way to do this.
Yet another unpopular "No" answer. The answer is: there is isn't a way to do this.
One possible work around if its vital to create such a brush might be to use a WriteableBitmap. Render an Image using the original source plus the Clip onto a WriteableBitmap then use it as the source to an ImageBrush.
Maybe this will help
I had a problem with an ImageBrush and a Border with a CornerRadius. I couldn't get the Image to fill/clip to fit. I resolved it by moving the ImageBrush to the content of the Border.
Here's the original with the problem:
<Border CornerRadius="0,0,4,4" BorderThickness="0">
<Border.Background>
<ImageBrush ImageSource="/SLTest;component/Resources/background_image.png" Opacity="1" Stretch="UniformToFill" />
</Border.Background>
<ListBox x:Name="lbiMesages"
Opacity="1" BorderThickness="0"
IsHitTestVisible="False"
ItemContainerStyle="{StaticResource ListBoxItemStyle1}"
>
Here's the working version:
<ListBox x:Name="lbiMessages"
Opacity="1" BorderThickness="0"
IsHitTestVisible="False"
ItemContainerStyle="{StaticResource ListBoxItemStyle1}"
>
<ListBox.Template>
<ControlTemplate>
<Border CornerRadius="0,0,4,4" BorderThickness="0">
<Border.Background>
<ImageBrush ImageSource="/SLTest;component/Resources/background_image.png" Opacity="1" Stretch="UniformToFill" />
</Border.Background>
...
</Border>
</ControlTemplate>

Resources