(C # Application for WPF)
I have a problem and I have to "draw" a coordinate system and enter only the coordinates (without lines) as seen in the picture.
I would like to use a library, because I also have to draw a frame and I thought with a library would it be easy.
So I've discovered GnuPlot, Oxyplot and draw myself. GnuPlot is unfortunately stupid since it has no library for a C # application. (Or if you have one, please let me know). Therefore, I used OxyPlot, but unfortunately OxyPlot shows me only the coordinate system.
Now to my question.
Is there anything better to draw coordinate systems with the coordinates?
It should meet the following requirements:
It should be a preview application, that is, if I change the size it should happen directly
I would like to make a frame, so it should help me in the process
there should be a library
it should be for a C # application
I would like to be first point marks for the X, Y coordinates, but later it should be circles with a circle diameter
later as a Bitmap
As mentioned above, I've used it with OxyPlot, but unfortunately it does not draw a graph (I used the sample documentation)
Maybe you have better ideas / a solution for OxyPlot.
Thanks in advance and I am happy about every reply.
XAML:
<Window x:Class="TestOxyPlot.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:oxy="http://oxyplot.org/wpf"
xmlns:local="clr-namespace:TestOxyPlot"
mc:Ignorable="d"
Title="MainWindow" Height="350" Width="525">
<Grid>
<oxy:Plot x:Name="oxyPlot" Title="{Binding Title}" Margin="207,53,0,0">
<oxy:Plot.Series>
<oxy:LineSeries ItemsSource="{Binding Points}"/>
</oxy:Plot.Series>
</oxy:Plot>
<TextBox x:Name="textBox" HorizontalAlignment="Left" Height="23" Margin="44,64,0,0" TextWrapping="Wrap" VerticalAlignment="Top" Width="120" MouseLeave="textBox_MouseLeave" TextChanged="textBox_TextChanged"/>
<TextBox x:Name="textBox1" HorizontalAlignment="Left" Height="23" Margin="44,101,0,0" TextWrapping="Wrap" VerticalAlignment="Top" Width="120" TextChanged="textBox1_TextChanged"/>
<Button x:Name="button" Content="Button" HorizontalAlignment="Left" Margin="68,174,0,0" VerticalAlignment="Top" Width="75" Click="button_Click"/>
</Grid>
</Window>
using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Data;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Imaging;
using System.Windows.Navigation;
using System.Windows.Shapes;
using OxyPlot;
namespace TestOxyPlot
{
/// <summary>
/// Interaktionslogik für MainWindow.xaml
/// </summary>
public partial class MainWindow : Window
{
public MainWindow()
{
InitializeComponent();
this.Title = "Example 2";
this.Points = new List<DataPoint>
{
new DataPoint(0, 4),
new DataPoint(10, 13),
new DataPoint(20, 15),
new DataPoint(30, 16),
new DataPoint(40, 12),
new DataPoint(50, 12)
};
}
public string Title { get; private set; }
public IList<DataPoint> Points { get; private set; }
private void textBox_MouseLeave(object sender, MouseEventArgs e)
{
}
private void textBox_TextChanged(object sender, TextChangedEventArgs e)
{
try
{
oxyPlot.Width = Int32.Parse(textBox.Text);
}
catch (Exception error)
{
MessageBox.Show("Message: " + error);
}
}
private void button_Click(object sender, RoutedEventArgs e)
{
}
private void textBox1_TextChanged(object sender, TextChangedEventArgs e)
{
try
{
oxyPlot.Width = Int32.Parse(textBox.Text);
}
catch (Exception error)
{
MessageBox.Show("Message: " + error);
}
}
}
}
Add this code
DataContext = this;
after this line
InitializeComponent();
and it will show the graph. Also, in order to remove the line and just draw the Markers, use something like this LineSeries:
<oxy:LineSeries ItemsSource="{Binding Points}" LineStyle="None" MarkerType="Circle" MarkerSize="5" MarkerFill="Black"/>
Edit
private void Button_Click(object sender, RoutedEventArgs e)
{
double randomNumX;
double randomNumY;
int h = DateTime.Now.Hour;
int m = DateTime.Now.Minute;
int s = DateTime.Now.Second;
String u = h.ToString() + m.ToString() + s.ToString();
int iu = Int32.Parse(u);
Random zufall = new Random(iu);
Points = new List<DataPoint>();
for (int i = 0; i < 10; i++)
{
randomNumX = zufall.NextDouble() * (10 - -10) + -10;
randomNumY = zufall.NextDouble() * (10 - -10) + -10;
Points.Add(new DataPoint(randomNumX, randomNumY));
}
ls.ItemsSource = Points;
}
and
<DockPanel>
<Button DockPanel.Dock="Top" Click="Button_Click" Content="Click Me"/>
<oxy:Plot x:Name="oxyPlot" Title="{Binding Title}">
<oxy:Plot.Axes>
<oxy:LinearAxis Position="Bottom" />
<oxy:LinearAxis Position="Right" MinimumPadding="0.1" MaximumPadding="0.1"/>
</oxy:Plot.Axes>
<oxy:Plot.Series>
<oxy:LineSeries x:Name="ls" ItemsSource="{Binding Points}" LineStyle="None" MarkerType="Circle" MarkerSize="5" MarkerFill="Black"/>
</oxy:Plot.Series>
</oxy:Plot>
</DockPanel>
By the way, for some reason, using ObservationCollection or InvalidatePlot(true) didn't work
Related
I'm using Material design. I created a color picker to choose the color the user wants, after the user chooses the color and theme.
I want to save these settings into a text file on the disk. I don't know how can I convert these types to a list for the string which can I use for reading theme that is saved :
private void MyColorPicker1_PreviewMouseMove(object sender, MouseEventArgs e)
{
string filepath = #"C:\Themses";
if (e.LeftButton == MouseButtonState.Pressed)
{
ITheme theme = _paletteHelper.GetTheme();
theme.SetPrimaryColor(Color.FromRgb(MyColorPicker1.Color.R, MyColorPicker1.Color.G, MyColorPicker1.Color.B)); //red
var Test = theme.GetBaseTheme();
// something here to write all setting inside of ITheme into the text file
//
_paletteHelper.SetTheme(theme);
}
}
How can I do that?
Full XAML:
<Window x:Class="WpfApp5.SettingThemsWins.MaterialThemSettingy"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:local="clr-namespace:WpfApp5.SettingThemsWins"
mc:Ignorable="d"
xmlns:materialDesign="http://materialdesigninxaml.net/winfx/xaml/themes"
Background="{DynamicResource MaterialDesignPaper}"
Title="Setting" Height="607" Width="1144" WindowStartupLocation="CenterScreen">
<Grid>
<materialDesign:ColorPicker x:Name="MyColorPicker1" HorizontalAlignment="Left" Margin="20,17,0,0" VerticalAlignment="Top" Height="353" Width="750" PreviewMouseMove="MyColorPicker1_PreviewMouseMove" />
<ToggleButton x:Name="ThemeActivationsBtn" Style="{StaticResource MaterialDesignSwitchToggleButton}" ToolTip="Activation Of Dark Theme" IsChecked="False" Margin="110,380,0,0" Click="ThemeActivationsBtn_Click" HorizontalAlignment="Left" Width="63" Height="27" VerticalAlignment="Top" />
<Label Content="Dark Theme :" HorizontalAlignment="Left" Height="24" Margin="20,382,0,0" VerticalAlignment="Top" Width="85"/>
<Button x:Name="SaverThemy" Content="Save Theme" HorizontalAlignment="Left" Margin="200,375,0,0" VerticalAlignment="Top" Width="170" Click="SaverThemy_Click"/>
</Grid>
</Window>
Code behind:
using MaterialDesignThemes.Wpf;
using System;
using System.Collections.Generic;
using System.IO;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Data;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Imaging;
using System.Windows.Shapes;
namespace WpfApp5.SettingThemsWins
{
/// <summary>
/// Interaction logic for MaterialThemSettingy.xaml
/// </summary>
public partial class MaterialThemSettingy : Window
{
private readonly PaletteHelper _paletteHelper = new PaletteHelper();
bool isDark;
public MaterialThemSettingy()
{
InitializeComponent();
//EmptySampleWind.Window1 window1 = new EmptySampleWind.Window1();
//window1.Show();
}
public static IEnumerable<string> SortByLength(IEnumerable<string> e)
{
// Use LINQ to sort the array received and return a copy.
var sorted = from s in e
orderby s.Length ascending
select s;
return sorted;
}
private void MyColorPicker1_PreviewMouseMove(object sender, MouseEventArgs e)
{
string filepath = #"C:\Themses";
if (e.LeftButton == MouseButtonState.Pressed)
{
ITheme theme = _paletteHelper.GetTheme();
theme.SetPrimaryColor(Color.FromRgb(MyColorPicker1.Color.R, MyColorPicker1.Color.G, MyColorPicker1.Color.B)); //red
var Test = theme.GetBaseTheme();
// something here to write all setting inside of ITheme into the text file
//
_paletteHelper.SetTheme(theme);
}
}
private void ThemeActivationsBtn_Click(object sender, RoutedEventArgs e)
{
isDark = (bool)ThemeActivationsBtn.IsChecked;
if (isDark)
{
ITheme theme = _paletteHelper.GetTheme();
IBaseTheme baseTheme = isDark ? new MaterialDesignDarkTheme() : (IBaseTheme)new MaterialDesignLightTheme();
theme.SetBaseTheme(baseTheme);
_paletteHelper.SetTheme(theme);
}
else
{
ITheme theme = _paletteHelper.GetTheme();
IBaseTheme baseTheme = isDark ? new MaterialDesignDarkTheme() : (IBaseTheme)new MaterialDesignLightTheme();
theme.SetBaseTheme(baseTheme);
_paletteHelper.SetTheme(theme);
}
}
}
}
I use DataTemplate to repeatedly generate the content of my ListBox.
The xaml code is as below:
<DataTemplate x:Key="singleUnit">
<StackPanel Orientation="Horizontal">
<TextBlock Text="{Binding fileName}" FontSize="20" Foreground="{Binding color}" HorizontalAlignment="Left" VerticalAlignment="Top"/>
<TextBlock/>
</StackPanel>
</DataTemplate>
<ListBox Name="MyListBox" Width="300" Height="600">
</ListBox>
And the cs code is:
private void Show()
{
const int TotalCount = 100;
for (int i = 0; i < TotalCount; i++)
{
ContentControl cc = new ContentControl();
cc.ContentTemplate = this.Resources["singleUnit"] as DataTemplate;
DataModel dm = new DataModel();
dm.fileName = "myfile" + i;
dm.color = new SolidColorBrush(Colors.Blue);
cc.Content = dm;
MyListBox.Items.Add(cc);
}
MyListBox.ScrollIntoView(MyListBox.Items[TotalCount / 2]);
}
Above code will generate below UI:
And I hope to change all the item's color: currently each item, the fileName's foreground color is blue. And I hope to change it to like green when the button is pressed.
This is like that user changes the color theme with some selection operation. And when the color changes, all the other things should be not changed, e.g. the position of the scroll bar.
The difficulty is that I use template to generate the content, and how to iterate each item and modify it.
I put the workable demo code on my Github:
https://github.com/tomxue/ChangeListBox.git
You could start from it.
Thanks!
I made your code work but it is still not perfectly right as you should have per each view a view-model and bind between them.
Your MainForm - should have a MainFormViewModel.
Your File Items - should have VmFile (or ViewModelFile as I wrote in the example)
You should be using ICommand to bind the button and not by having an event as you did.
Shortly put, I don't think you are working correct with MVVM, I advise you to read more about MVVM.
Copy to your .xaml file:
<Window x:Class="WpfApp14.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:local="clr-namespace:WpfApp14"
mc:Ignorable="d"
Title="MainWindow" Height="450" Width="800">
<Grid>
<ListBox Name="MyListBox" Width="300" Height="600">
<ListBox.ItemTemplate>
<DataTemplate>
<StackPanel Orientation="Horizontal">
<TextBlock Text="{Binding FileName}" FontSize="20" Foreground="{Binding Color}"
HorizontalAlignment="Left" VerticalAlignment="Top"/>
<TextBlock/>
</StackPanel>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
<Button Content="Change color theme" HorizontalAlignment="Left" Margin="56,126,0,0" VerticalAlignment="Top" Width="164" Click="Button_Click" Height="36"/>
</Grid>
</Window>
Copy to your .cs file:
using System;
using System.Collections.Generic;
using System.ComponentModel;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Data;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Imaging;
using System.Windows.Navigation;
using System.Windows.Shapes;
namespace WpfApp14
{
public class ViewModelFile : INotifyPropertyChanged
{
private string filename;
private SolidColorBrush solidColorBrush;
public event PropertyChangedEventHandler PropertyChanged;
public string FileName
{
get =>filename;
set
{
filename = value;
PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(nameof(FileName)));
}
}
public SolidColorBrush Color
{
get => solidColorBrush;
set
{
solidColorBrush = value;
PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(nameof(Color)));
}
}
}
/// <summary>
/// Interaction logic for MainWindow.xaml
/// </summary>
public partial class MainWindow : Window
{
public MainWindow()
{
InitializeComponent();
Refresh();
}
private void Refresh()
{
const int TotalCount = 100;
for (int i = 0; i < TotalCount; i++)
{
ViewModelFile vm = new ViewModelFile
{
FileName = "myfile" + i,
Color = new SolidColorBrush(Colors.Blue)
};
MyListBox.Items.Add(vm);
}
MyListBox.ScrollIntoView(MyListBox.Items[TotalCount / 2]);
}
private void Button_Click(object sender, RoutedEventArgs e)
{
// Do something to change all fileName items' forground color to red.
// For example if user changes the color theme, and we should just change some UI color
// while not changing any other part, e.g. the position of scrollbar
foreach (var item in MyListBox.Items)
((ViewModelFile)item).Color = new SolidColorBrush(Colors.Red);
}
}
}
I'm making an image viewer. I have a mouse event that is supposed to trigger when an image (or child of StackPanel in this case), is clicked. The event is triggered as intended. The problem is, since the pathfile of the images is different depending on whichever is selected (in which directory, etc.), I just don't know how to get the pathfile of the specific image that is currently clicked on. The directory depends on whichever folder is loaded, so the pathfile could be different everytime.
If you scroll all the way down to Image_Load(), I have the Pic.Fill which is a reference to the rectangle that is being filled with the image. I'm trying to find the first parameter for Uri(_,_), which is supposed to be where the #"path" of the current image is.
using System;
using System.IO;
using Microsoft.Win32;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Data;
using System.Drawing;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Forms;
using System.Windows.Media;
using System.Windows.Media.Imaging;
using System.Windows.Navigation;
using System.Windows.Shapes;
namespace WpfApp1
{
/// <summary>
/// Interaction logic for MainWindow.xaml
/// </summary>
public partial class MainWindow : Window
{
FolderBrowserDialog fbd = new FolderBrowserDialog();
List<string> paths = new List<string>();
string[] extension = new[] { ".jpg", ".png", ".jpeg", ".gif", ".bmp", ".tif", ".tiff" };
public MainWindow()
{
InitializeComponent();
}
private void Button_Click(object sender, RoutedEventArgs e) {
if (fbd.ShowDialog() == System.Windows.Forms.DialogResult.OK)
{
string[] files = Directory.GetFiles(fbd.SelectedPath);
FileLocation.Text = fbd.SelectedPath;
}
}
private void OpenButton_Click(object sender, RoutedEventArgs e)
{
LoadPhotos();
}
private void LoadPhotos()
{
try
{
DirectoryInfo di = new DirectoryInfo(fbd.SelectedPath);
foreach (var fi in di.GetFiles().Where(f => extension.Contains(f.Extension.ToLower())).ToArray())
{
paths.Add(fi.FullName);
}
Photos.ItemsSource = paths;
} catch (Exception e)
{
Console.WriteLine("File not found.", e.Source);
}
}
private void Image_Load(object sender, MouseButtonEventArgs e)
{
// What is the reference here?
Pic.Fill = new ImageBrush { ImageSource = new BitmapImage(new Uri(/*Insert pathfile here*/, UriKind.Absolute)) };
}
}
}
Here's my .xaml. I've analyzed it to see a reference but the only thing that stands out is the Image Source, which I've tagged with a comment. It's set to { Binding . } which I'm going to assume means, whatever image is referenced. But how do I connect that variable reference to my Image_Load()? (which is declared on the instantiation of ListBox)
<Window x:Class="WpfApp1.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:local="clr-namespace:WpfApp1"
mc:Ignorable="d"
Title="MainWindow" Height="1081" Width="1720.5">
<Grid Margin="0,0,2,-0.578">
<Button x:Name="OpenButton" Content="Load" HorizontalAlignment="Left" Height="44" Margin="1166.374,932.042,0,0" VerticalAlignment="Top" Width="145.666" Background="#FFDDDDDD" FontSize="24" Click="OpenButton_Click"/>
<Button x:Name="BrowseButton" Content="Browse" HorizontalAlignment="Left" Height="44" Margin="58.666,932.042,0,0" VerticalAlignment="Top" Width="134.166" Background="#FFDDDDDD" FontSize="24" Click="Button_Click"/>
<Rectangle x:Name="Pic" Fill="#FFF4F4F5" HorizontalAlignment="Left" Height="878.767" Margin="58.666,34.733,0,0" Stroke="Black" VerticalAlignment="Top" Width="1253.374"/>
<ScrollViewer VerticalScrollBarVisibility="Visible" Width="327.46" HorizontalAlignment="Left" Margin="1339.04,34.733,0,137.078" RenderTransformOrigin="0.5,0.5" >
<StackPanel Width="327.46" RenderTransformOrigin="0.516,0.496" HorizontalAlignment="Left" VerticalAlignment="Center" Height="878.085">
<ListBox x:Name="Photos"
Grid.Row="2" Grid.Column="1" Height="876" PreviewMouseDown="Image_Load">
<ListBox.ItemTemplate>
<DataTemplate>
<Grid Width="300" Height="100">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="Auto"/>
<ColumnDefinition/>
</Grid.ColumnDefinitions>
/* Image Source? */
<Image Source="{Binding .}" Grid.Column="0"/>
</Grid>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
</StackPanel>
</ScrollViewer>
<TextBlock x:Name="FileLocation" HorizontalAlignment="Left" Height="44" Margin="192.832,948.542,0,0" TextWrapping="Wrap" VerticalAlignment="Top" Width="973.542" Foreground="#FF515151" TextAlignment="Center" FontSize="14"/>
</Grid>
</Window>
I've been learning on the way using Blend-- some youtube tutorials here and there. I've tried to look for a solution online but all the questions about it usually involve a static and specific directory. This is my first program and the only thing I need is that darn path file reference. There are so many object reference so I just don't even know how to wrap my head around it, being so unfamiliar with these classes. Some assistance would be very much appreciated! :)
I'v a progressbar and an image.
When Progress Bar value is 50, image loaded by 50%.
I tried to add image as the progressbar foreground, but it have green shade. So ugly.
How can I do this?
To run this sample, you need a snake image which you can get from http://res.freestockphotos.biz/pictures/16/16242-illustration-of-a-green-snake-pv.png. I have used this url directly, but your should download image first and then use it.
You need a control template for your ProgressBar because you want to show percentage status too.
Otherwise normal ProgressBar would do.
Code can be used as is :
<Window x:Class="WpfControlTemplates._32794074.Win32794074"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="Win32794074" Height="600" Width="1000">
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="397*"/>
<RowDefinition Height="173*"/>
</Grid.RowDefinitions>
<ProgressBar x:Name="PBarCustom" Width="958" Height="200" Maximum="958" Value="958" Foreground="#FFE6E61F" Margin="17,185,17,11.932" ValueChanged="PBarCustom_ValueChanged">
<ProgressBar.Background>
<ImageBrush ImageSource="http://res.freestockphotos.biz/pictures/16/16242-illustration-of-a-green-snake-pv.png"/>
</ProgressBar.Background>
<ProgressBar.Template>
<ControlTemplate>
<Grid Background="{TemplateBinding Background}">
<Rectangle x:Name="Thumb" HorizontalAlignment="Left" Fill="#FFC5EA1F" Stroke="#FF0DB442" Width="{TemplateBinding Width}" />
<Ellipse Fill="#FF7DEEDE" Height="124" Stroke="#FF0DB442" Width="150" VerticalAlignment="Center" HorizontalAlignment="Center" Opacity="0.3"/>
<Label x:Name="tbStatus" VerticalContentAlignment="Center" HorizontalContentAlignment="Center" FontWeight="Bold" FontSize="75" Foreground="#FF21BD76" Content="0" />
</Grid>
</ControlTemplate>
</ProgressBar.Template>
</ProgressBar>
<Button x:Name="BtnLoadSnake" Content="Load Snake" HorizontalAlignment="Left" Margin="462,14.068,0,0" VerticalAlignment="Top" Width="75" Click="BtnLoadSnake_Click" Grid.Row="1"/>
</Grid>
</Window>
using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Data;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Imaging;
using System.Windows.Shapes;
using System.Windows.Threading;
namespace WpfControlTemplates._32794074
{
/// <summary>
/// Interaction logic for Win32794074.xaml
/// </summary>
public partial class Win32794074 : Window
{
public Win32794074()
{
InitializeComponent();
}
DispatcherTimer timer;
private void BtnLoadSnake_Click(object sender, RoutedEventArgs e)
{
BtnLoadSnake.IsEnabled = false;
PBarCustom.Value = PBarCustom.Maximum;
Rectangle thumb = (Rectangle)PBarCustom.Template.FindName("Thumb", PBarCustom);
thumb.Width = PBarCustom.Value;
Label status = (Label)PBarCustom.Template.FindName("tbStatus", PBarCustom);
status.Content = ((int)(100 - ((100 * PBarCustom.Value) / PBarCustom.Maximum))).ToString();
Dispatcher disp = PBarCustom.Dispatcher;
EventHandler pBarCallbackHandler = new EventHandler(pBarCallback);
timer = new DispatcherTimer(TimeSpan.FromSeconds(0.5), DispatcherPriority.Normal, pBarCallback, disp);
}
private void pBarCallback(object sender, EventArgs e)
{
PBarCustom.Value -= 13;
Rectangle thumb = (Rectangle)PBarCustom.Template.FindName("Thumb", PBarCustom);
thumb.Width = PBarCustom.Value;
Label status = (Label)PBarCustom.Template.FindName("tbStatus", PBarCustom);
status.Content = ((int)(100 - ((100 * PBarCustom.Value) / PBarCustom.Maximum))).ToString();
if (PBarCustom.Value == 0)
timer.Stop();
}
private void PBarCustom_ValueChanged(object sender, RoutedPropertyChangedEventArgs<double> e)
{
if(e.NewValue == 0)
BtnLoadSnake.IsEnabled = true;
}
}
}
i had similar scenario.
if you want the scroll bar to be just a rectangle,
easiest way to make it:
1- add an image to your window.
2- put a grid on it in such a way that the grid hides the image.
3- programatically change the width or height of the grid.
tell me if you needed an example code.
I am new in windows phone development. i want to try to implement pull down to refresh page. i use listbox under scrollviewer i am having a problem while implement in windows phone 8.1 silverlight application. here is my code
MainPage.xaml
<phone:PhoneApplicationPage
x:Class="PullDownToScroll.MainPage"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:phone="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone"
xmlns:shell="clr-namespace:Microsoft.Phone.Shell;assembly=Microsoft.Phone"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d"
FontFamily="{StaticResource PhoneFontFamilyNormal}"
FontSize="{StaticResource PhoneFontSizeNormal}"
Foreground="{StaticResource PhoneForegroundBrush}"
SupportedOrientations="Portrait" Orientation="Portrait"
shell:SystemTray.IsVisible="True">
<!--LayoutRoot is the root grid where all page content is placed-->
<Grid x:Name="LayoutRoot" Background="Transparent">
<Grid>
<ScrollViewer Name="OuterScroll" Loaded="OuterScroll_Loaded" LayoutUpdated="OuterScroll_ViewChanged">
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="60"/>
<RowDefinition/>
</Grid.RowDefinitions>
<Grid Background="GreenYellow">
<Image Source="Assets/down13.png" Height="40" Width="40" HorizontalAlignment="Left" Margin="20,0,0,0">
<Image.RenderTransform>
<RotateTransform x:Name="RefreshIndicatiorRotateTransform" CenterX="20" CenterY="20"/>
</Image.RenderTransform>
</Image>
<TextBlock Name="RefreshIndicatiorTextBlock" VerticalAlignment="Center" HorizontalAlignment="Left" Margin="80,0,0,0" Width="200" Foreground="Black"/>
</Grid>
<ListBox Name="InnerListView" Grid.Row="1">
</ListBox>
</Grid>
</ScrollViewer>
</Grid>
</Grid>
</phone:PhoneApplicationPage>
MainPage.xaml.cs
using System;
using System.Collections.Generic;
using System.Linq;
using System.Net;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Navigation;
using Microsoft.Phone.Controls;
using Microsoft.Phone.Shell;
using PullDownToScroll.Resources;
using System.Windows.Media;
namespace PullDownToScroll
{
public partial class MainPage : PhoneApplicationPage
{
// Constructor
public MainPage()
{
InitializeComponent();
this.InitializeComponent();
InnerListView.Height = ApplicationView.GetForCurrentView().VisibleBounds.Height;
GenerateRandomListViewItem();
this.NavigationCacheMode = NavigationCacheMode.Required;
// Sample code to localize the ApplicationBar
//BuildLocalizedApplicationBar();
}
public void GenerateRandomListViewItem()
{
InnerListView.Items.Clear();
Random rand = new Random();
for (int i = 0; i < 20; i++)
{
ListBox item = new ListBox();
item.Background = new SolidColorBrush(Color.FromArgb(255, (byte)rand.Next(0, 255), (byte)rand.Next(0, 255), (byte)rand.Next(0, 255)));
item.Height = rand.NextDouble() * 150;
item.Margin = new Thickness(0, 8, 0, 8);
InnerListView.Items.Add(item);
}
}
private void OuterScroll_Loaded(object sender, RoutedEventArgs e)
{
OuterScroll.ChangeView(null, 60, null, false);
}
private void OuterScroll_ViewChanged(object sender, ScrollViewerViewChangedEventArgs e)
{
if (!e.IsIntermediate)
{
if (OuterScroll.VerticalOffset < 60)
{
if (OuterScroll.VerticalOffset <= 0.5)
OuterScroll.ChangeView(null, 60, null, false);
else
OuterScroll.ChangeView(null, 60, null);
}
if (OuterScroll.VerticalOffset <= 0.5)
{
GenerateRandomListViewItem();
}
}
else
{
double angle = (65 - OuterScroll.VerticalOffset) * 180 / 65;
RefreshIndicatiorRotateTransform.Angle = angle;
}
if (OuterScroll.VerticalOffset == 0)
RefreshIndicatiorTextBlock.Text = "Release to refresh";
else
RefreshIndicatiorTextBlock.Text = "Pull to refresh";
}
}
}
In MainPage.xaml.cs i found an error
Error 1 The type or namespace name 'ScrollViewerViewChangedEventArgs' could not be found (are you missing a using directive or an assembly reference?)
how should i resolve this problem ?? please share you suggestion.
Thanks in advance.
Best way to refresh view/screen use Application bar. Put refresh icon in Application bar and on icon click refresh your view/screen.
This link is help full for how to use Appication bar