I'm using OxyPlot in a Xamarin Forms project.
In WPF, the tracker (popup when I click on a datapoint) has a white background with yellow text, making it impossible to see.
In UWP however, it is just fine with a yellow background and black text.
How can I change the font color of the tracker to black?
xmlns:oxy="clr-namespace:OxyPlot.Xamarin.Forms;assembly=OxyPlot.Xamarin.Forms"
<oxy:PlotView Model="{Binding MyModel}"
HorizontalOptions="FillAndExpand"
VerticalOptions="FillAndExpand">
</oxy:PlotView>
You can change the default colors of Oxyplot Tracker by modifying the Control Template. For example,
<oxy:PlotView Height="500" Width="500" Model="{Binding MyModel}">
<oxy:PlotView.DefaultTrackerTemplate>
<ControlTemplate>
<oxy:TrackerControl Position="{Binding Position}" LineExtents="{Binding PlotModel.PlotArea}">
<oxy:TrackerControl.Background>
<SolidColorBrush Color="LightBlue" />
</oxy:TrackerControl.Background>
<oxy:TrackerControl.Content>
<TextBlock Text="{Binding}" Margin="7" Foreground="Black" />
</oxy:TrackerControl.Content>
</oxy:TrackerControl>
</ControlTemplate>
</oxy:PlotView.DefaultTrackerTemplate>
</oxy:PlotView>
Of course, you can set the binding as well in the above, but for the sake of example, given the color directly in above example.
I want to have a logout icon in the appbar.
I was sure it should be in the common styles, but discovered that unfortunately it's not.
So, how can I do it?
I've found this site, where I found the icon I wanted to the logout button, and copied the xaml which gave me the path. Next I added this code to the common:
<Style x:Key="LogoutAppBarButtonStyle" TargetType="ButtonBase" BasedOn="{StaticResource AppBarButtonStyle}">
<Setter Property="AutomationProperties.AutomationId" Value="LogoutAppBarButton" />
<Setter Property="AutomationProperties.Name" Value="Logout" />
<Setter Property="ContentTemplate">
<Setter.Value>
<DataTemplate>
<Grid>
<Viewbox RenderTransformOrigin="0.47,0.47">
<Viewbox.RenderTransform>
<TransformGroup>
<CompositeTransform Rotation="0" ScaleX="0.551720260135184" ScaleY="0.551720260135184" />
</TransformGroup>
</Viewbox.RenderTransform>
<Path Stretch="Uniform"
Fill="{Binding Path=Foreground, RelativeSource={RelativeSource Mode=TemplatedParent}}"
Data="F1 M 0,71.4297C -0.0207825,54.2669 7.09511,41.2825 13.974,33.0403C 20.8893,24.7292 27.6055,20.7252 28.2083,20.3522C 32.6992,17.6946 38.4714,19.2199 41.0976,23.7583C 43.7188,28.2812 42.2317,34.0878 37.7787,36.7583L 37.7604,36.7707L 37.7044,36.8053L 37.2148,37.1308L 35.1185,38.6797C 33.3203,40.1106 30.849,42.3333 28.414,45.2734C 23.5221,51.2292 18.8593,59.6705 18.8385,71.427C 18.8424,83.2799 23.5678,93.9374 31.2579,101.724C 38.9648,109.497 49.5065,114.279 61.2304,114.281C 72.9544,114.279 83.4961,109.497 91.2019,101.724C 98.8932,93.9374 103.619,83.2799 103.622,71.427C 103.602,60.0305 99.2304,51.7707 94.5065,45.8346C 90.0091,40.207 85.1979,37.0722 84.7188,36.7799L 84.7031,36.7721L 84.6888,36.7642L 84.6784,36.7597C 80.2304,34.0865 78.7435,28.2799 81.362,23.7571C 83.9909,19.2187 89.7618,17.6933 94.2514,20.3509C 94.8568,20.7226 101.573,24.7265 108.488,33.0384C 115.371,41.2825 122.483,54.2655 122.464,71.427C 122.457,105.611 95.0443,133.322 61.2317,133.333C 27.4205,133.322 0.00785828,105.611 0,71.4297 Z M 51.8125,66.668L 51.8125,38.0944L 51.8125,9.52411C 51.8125,4.26556 56.03,-3.05176e-005 61.233,-3.05176e-005C 66.4323,-3.05176e-005 70.6497,4.26556 70.6497,9.52411L 70.6497,38.0944L 70.6497,66.668L 70.6524,66.668C 70.6524,71.9218 66.4323,76.1901 61.233,76.1901C 56.03,76.1901 51.8125,71.9218 51.8125,66.668 Z " />
</Viewbox>
</Grid>
</DataTemplate>
</Setter.Value>
</Setter>
</Style>
It is important to pay attention to the Path's Fill property, it can't be white color, because when we press on it and hold it, the default appbar icons become white, so the color should be changed to black, and therefore, we use this code which get's the foreground color from the parent - AppBarButtonStyle, which already has this logic on appbar icon pressed. This is the code:
Fill="{Binding Path=Foreground, RelativeSource={RelativeSource Mode=TemplatedParent}}"
One more thing, I have used some renders because the image was a little bit crooked, so I have fixed it by rendering it, maybe not the best way, but now it works perfectly !
The last step was to add this to all the pages I wanted to use the login appbar icon:
<Button Style="{StaticResource LogoutAppBarButtonStyle}" Click="Logout_Click" />
I'm trying to implement autoscrolling and snapping to images in a windows phone 8 app
I currently have couple of images in a stackpanel inside a scrollviewer, and I'd like them to auto scroll horizontally every certain amount of time [5 seconds for example] while still being able to scroll and snap manually
this is what I have so far
<ScrollViewer x:Name="featuredScroll" Grid.Row="2" HorizontalScrollBarVisibility="Visible" VerticalScrollBarVisibility="Disabled" >
<StackPanel x:Name="featuredStack" Orientation="Horizontal">
<StackPanel.Resources>
<Style TargetType="Image">
<Setter Property="Margin" Value="0,0,5,0"/>
</Style>
</StackPanel.Resources>
<Image Source="http://www.google.com/images/srpr/logo4w.png"/>
<Image Source="http://www.google.com/images/srpr/logo4w.png"/>
<Image Source="http://www.google.com/images/srpr/logo4w.png"/>
</StackPanel>
</ScrollViewer>
[images are placeholders]
so what I have now shows a scrollable list of those images [banners] which I can scroll horizontally, any idea how to achieve that ?
http://www.c-sharpcorner.com/UploadFile/5439e6/image-slideshow-using-dispatchtimer-in-windows-store-apps/
How about this option? This is example for Win store apps, but i don't see the reason why you couldn't rewrite it to WP
I was wondering if it's possible to bind the image path when using an Image as the Panorama Title, the reason why I need a bind for the Source is that when the user have the phone background to "white" the logo would be black, and vice versa.
This is the code I'm using:
<controls:Panorama.TitleTemplate>
<DataTemplate>
<Image Source="/PanoramaApp5;component/Images/logo.png" Margin="14,105,0,10" HorizontalAlignment="Left" Name="logo" Stretch="Fill" VerticalAlignment="Top" Width="700" Height="70"/>
<!--<TextBlock Text="{Binding Content, RelativeSource={RelativeSource TemplatedParent}}" FontSize="100" Margin="10,50,0,0" />-->
</DataTemplate>
</controls:Panorama.TitleTemplate>
If I let the default Title (which is text), it will work just fine, but I need it as an image.
Just set an empty binding for your image source, then assign it using the Title property of your panorama:
<controls:Panorama x:Name="Panorama">
<controls:Panorama.TitleTemplate>
<DataTemplate>
<Image Source="{Binding}" />
</DataTemplate>
</controls:Panorama.TitleTemplate>
</controls:Panorama>
Then from the code behind:
this.Panorama.Title = new Uri("uri of your picture");
Just to provide an example of a working version, Facebook uses this same method in the header of their Windows Phone application and instead of user binding they automatically pull photos of the user to stick together and use in the pano
I have added a ListView to a Metro Style Blank App. Added to the ListView are 3 Strings. I want to change the LineHeight , but cannot find a property. Below is my xaml code.
<Grid Background="{StaticResource ApplicationPageBackgroundBrush}">
<ListView HorizontalAlignment="Left" Height="277.167" Margin="235.51,161,0,0" VerticalAlignment="Top" Width="100" RenderTransformOrigin="0.5,0.5" UseLayoutRounding="False" d:LayoutRounding="Auto">
<ListView.RenderTransform>
<CompositeTransform SkewX="-0.338" TranslateX="-0.327"/>
</ListView.RenderTransform>
<x:String>test 1</x:String>
<x:String>Test2</x:String>
<x:String>Test3</x:String>
</ListView>
</Grid>
How do I decrease, increase the line height of the strings in the ListView box? I want to decrease the space between the lines.
Thanks
Try editing a ItemContainerTemplate and then play with the properties available like margin and padding.
See my answer here :
WPF ComboBox customization in windows8
let me know in case you need any help.