I have a user control with custom popup (UserHelperButton). I have manually set the Vertical and Horizontal Offset to show popup on the right position. Now I need to update it's position to center. I'm not able to center it on x axis and on vertical.
On the root windows I add add UserHelperButton on different locations
<Grid Margin="0,0,0,25">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="120" />
<ColumnDefinition Width="50" />
<ColumnDefinition Width="50" />
<ColumnDefinition Width="120" />
<ColumnDefinition Width="50" />
<ColumnDefinition Width="*" />
<ColumnDefinition Width="120" />
<ColumnDefinition Width="50" />
</Grid.ColumnDefinitions>
<UserControls:UserLabel Text="Varnost v dvoje" Grid.Column="0" />
<UserControls:UserCheckBox x:Name="cbxDouble" Grid.Column="1" cbxClick="cbxDouble_cbxClick" />
<UserControls:UserHelperButton Grid.Column="2" HelperText="V primeru, da se zavarujeta dve osebi, obe zavarovani osebi pridobita nižjo premijo za sklenjena zavarovanja." />
<UserControls:UserLabel x:Name="lblRefNum" Text="Referenčna številka" Grid.Column="3" />
<UserControls:UserCheckBox x:Name="cbxRefNum" Grid.Column="4" cbxClick="cbxRefNum_cbxClick" />
<UserControls:UserTextBox x:Name="txbRefNum" Grid.Column="5" ValidationMessage="Vnesite referenčno številko!" />
<UserControls:UserLabel Text="Zaposlen na Pošta Slovenija" Grid.Column="6" />
<UserControls:UserCheckBox x:Name="cbxPS" Grid.Column="7" cbxClick="cbxPS_cbxClick" />
or
<Grid Margin="0,25,0,0">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="500" />
<ColumnDefinition Width="*" />
<ColumnDefinition Width="50" />
</Grid.ColumnDefinitions>
<UserControls:UserLabel Grid.Column="0" x:Name="lblInsurance" Text="Priporočena varnost do 65. leta" LabelMode="Heading" ValidationMessage="Vsota zavarovanj je premajhna!" />
<UserControls:UserHelperButton x:Name="helper2" Grid.Column="2" />
</Grid>
userControl xaml:
<Grid x:Name="grid" Margin="0" MaxHeight="50" Canvas.ZIndex="4" VerticalAlignment="Center">
<Button x:Name="btnHelper" AutomationProperties.Name="" Style="{StaticResource HelpAppBarButtonStyle}" HorizontalAlignment="Left" VerticalAlignment="Center" Height="70" Click="btnHelper_Click" />
<Popup x:Name="popHelper" IsLightDismissEnabled="True" VerticalOffset="-150" HorizontalOffset="-50">
<Border BorderThickness="25" CornerRadius="25" BorderBrush="Gray" Background="Gray">
<Grid Background="Gray" Width="400" Height="300">
<Grid.RowDefinitions>
<RowDefinition Height="60" />
<RowDefinition Height="*" />
</Grid.RowDefinitions>
<local:UserLabel Text="Pomoč" LabelMode="Heading" VerticalAlignment="Top" />
<Button x:Name="btnClose" AutomationProperties.Name="" Grid.Row="0" Style="{StaticResource NoAppBarButtonStyle}" HorizontalAlignment="Right" VerticalAlignment="Top" Padding="12,0,0,0" Height="100" Click="btnClose_Click" RenderTransformOrigin="0.5,0.5" >
<Button.RenderTransform>
<CompositeTransform TranslateY="-15"/>
</Button.RenderTransform>
</Button>
<WebView x:Name="webviewControl" Grid.Row="1" Margin="0,20,0,0" Height="200" Width="400" />
</Grid>
</Border>
</Popup>
On load event I fill popup with help text
private void UserControl_Loaded(object sender, RoutedEventArgs e)
{
string html = "<html><body style=\"font-family: 'Segoe UI'; background-color: gray; color: white; margin: 0;\">" + g_text + "</body></html>";
var fragment = HtmlFormatHelper.GetStaticFragment(HtmlFormatHelper.CreateHtmlFormat(html));
webviewControl.NavigateToString(fragment);
}
So how can I do that?
Thx
Poki
I do it like this:
private void popup_Loaded(object sender, RoutedEventArgs e)
{
popup.HorizontalOffset = (Window.Current.Bounds.Width - popupGrid.Width) / 2;
popup.VerticalOffset = (Window.Current.Bounds.Height - popupGrid.Height) / 2;
}
Related
I would like to append labels to a box view using C#. The labels have to correspond to certain columns within each row.
The labels should fill the columns under the headers as in the picture below:
However after appending the the content to the Grid element it becomes a jumbled mess. Below is my code
.xaml
<Grid.RowDefinitions>
<RowDefinition Height="*" />
<RowDefinition Height="{StaticResource dividerThickness}" />
<RowDefinition Height="40" />
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="{StaticResource dividerThickness}" />
<ColumnDefinition Width="45" />
<ColumnDefinition Width="{StaticResource dividerThickness}" />
<ColumnDefinition Width="*" />
<ColumnDefinition Width="{StaticResource dividerThickness}" />
<ColumnDefinition Width="*" />
<ColumnDefinition Width="{StaticResource dividerThickness}" />
<ColumnDefinition Width="45" />
<ColumnDefinition Width="{StaticResource dividerThickness}" />
<ColumnDefinition Width="45" />
<ColumnDefinition Width="{StaticResource dividerThickness}" />
<ColumnDefinition Width="45" />
<ColumnDefinition Width="{StaticResource dividerThickness}" />
<ColumnDefinition Width="45" />
<ColumnDefinition Width="{StaticResource dividerThickness}" />
</Grid.ColumnDefinitions>
<!-- Vertical Lines -->
<BoxView Grid.Row="0" Grid.Column="0" Grid.RowSpan="7" />
<BoxView Grid.Row="0" Grid.Column="2" Grid.RowSpan="7" />
<BoxView Grid.Row="0" Grid.Column="4" Grid.RowSpan="7" />
<BoxView Grid.Row="0" Grid.Column="6" Grid.RowSpan="7" />
<BoxView Grid.Row="0" Grid.Column="8" Grid.RowSpan="7" />
<BoxView Grid.Row="0" Grid.Column="10" Grid.RowSpan="7" />
<BoxView Grid.Row="0" Grid.Column="12" Grid.RowSpan="7" />
<BoxView Grid.Row="0" Grid.Column="14" Grid.RowSpan="7" />
<Label Grid.Row="0" Grid.Column="0" Grid.ColumnSpan="14" Text="Title" Style="{StaticResource headerRowStyle}" />
<BoxView Grid.Row="1" Grid.Column="0" Grid.ColumnSpan="14" />
<Label Grid.Row="2" Grid.Column="1" Text="Head 1" Style="{StaticResource resultTypeRow}" />
<Label Grid.Row="2" Grid.Column="3" Text="Head 2" Style="{StaticResource resultTypeRow}" />
<Label Grid.Row="2" Grid.Column="5" Text="Head 3" Style="{StaticResource resultTypeRow}" />
<Label Grid.Row="2" Grid.Column="7" Text="Head 4" Style="{StaticResource resultTypeRow}" />
<Label Grid.Row="2" Grid.Column="9" Text="Head 5" Style="{StaticResource resultTypeRow}" />
<Label Grid.Row="2" Grid.Column="11" Text="Head 6" Style="{StaticResource resultTypeRow}" />
<Label Grid.Row="2" Grid.Column="13" Text="Head 7" Style="{StaticResource resultTypeRow}" />
</Grid>
data.xaml.cs
protected override void OnAppearing()
{
base.OnAppearing();
var row = 3;
foreach (var result in Results)
{
var dist = new Label
{
HorizontalOptions = LayoutOptions.Center,
VerticalOptions = LayoutOptions.Center,
FontSize = 9,
Text = result.Dist.ToString(),
};
var cycle = new Label
{
HorizontalOptions = LayoutOptions.Center,
VerticalOptions = LayoutOptions.Center,
FontSize = 9,
Text = result.cycle.ToString(),
};
//REST OF LABELS HERE THEN APPEND TO PANEL
//Panel is the x:Name of the Grid Element
Panel.Children.Add(dist,1,row);
Panel.Children.Add(cycle, 3, row);
Panel.Children.Add(data, 5, row);
Panel.Children.Add(data2, 7, row);
Panel.Children.Add(data3, 9, row);
Panel.Children.Add(data4, 11, row);
Panel.Children.Add(data5, 13, row);
row++;
count++;
}
}
Any idea what I need to do be able to neatly fit my results into those columns?
I have a usercontrol with 2 ListViews in it. One for holding a list of predefined categories and one for the list with all the categories in it.
When i place the ListViews inside a <Grid> than everything works perfect.
The working xaml code (with Grid):
<Grid Style="{StaticResource ResourceKey=ContentStyle}">
<Grid.RowDefinitions>
<RowDefinition Height="Auto"/>
<RowDefinition Height="*"/>
</Grid.RowDefinitions>
<ListView x:Name="lstPredefinedCategories" Grid.Row="0" ItemsSource="{Binding PredefinedCategories}" SelectionMode="Multiple" Margin="20">
<ListView.Header>
<StackPanel>
<TextBlock Text="Voorgestelde categorieën" Style="{StaticResource TextBlockStyle}" FontWeight="SemiBold" Foreground="Black" />
<Rectangle Style="{StaticResource DividerStyle}" Fill="Black"/>
</StackPanel>
</ListView.Header>
<ListView.ItemTemplate>
<DataTemplate>
<TextBlock Text="{Binding}" Style="{StaticResource TextBlockStyle}" HorizontalAlignment="Left" TextWrapping="Wrap" Width="300" />
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
<Grid Grid.Row="1">
<Grid.RowDefinitions>
<RowDefinition Height="Auto" />
<RowDefinition Height="Auto" />
<RowDefinition Height="Auto" />
<RowDefinition Height="*" />
<RowDefinition Height="Auto" />
<RowDefinition Height="Auto" />
</Grid.RowDefinitions>
<StackPanel Grid.Row="0" Margin="20,0">
<TextBlock Text="Alle categorieën" Style="{StaticResource TextBlockStyle}" FontWeight="SemiBold" Foreground="Black" />
<Rectangle Style="{StaticResource DividerStyle}" Fill="Black"/>
</StackPanel>
<TextBox x:Name="txtSearch" PlaceholderText="Zoek categorie" Grid.Row="1" Style="{StaticResource SearchboxStyle}" Margin="20,0" TextChanged="txtSearch_TextChanged" />
<Rectangle Grid.Row="2" Style="{StaticResource DividerStyle}" Margin="20, 0" />
<ListView x:Name="lstCategories" Grid.Row="3" Margin="20,10,20,0" ItemsSource="{Binding Categories}" SelectionMode="Multiple" SelectionChanged="lstCategories_SelectionChanged">
<ListView.ItemTemplate>
<DataTemplate>
<TextBlock Text="{Binding Key}" Style="{StaticResource TextBlockStyle}" HorizontalAlignment="Left" TextWrapping="Wrap" Width="300" />
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
<Rectangle Grid.Row="4" Style="{StaticResource DividerStyle}" Margin="20, 0" />
<Grid Grid.Row="5">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*" />
<ColumnDefinition Width="Auto" />
<ColumnDefinition Width="*" />
</Grid.ColumnDefinitions>
<Button x:Name="btnAnnuleren" Grid.Column="0" Content="Annuleren" Style="{StaticResource ButtonAnnulerenStyle}" Click="btnAnnuleren_Click"/>
<Rectangle Grid.Column="1" Fill="#A9A9A9" Width="0.5" Margin="10,0" />
<Button x:Name="btnSelecteren" Grid.Column="2" Content="Selecteren" Style="{StaticResource ButtonAnnulerenStyle}" Click="btnSelecteren_Click"/>
</Grid>
</Grid>
</Grid>
The only problem with this is that I dont get the UI behaviour that I want. If I use a grid then only the red border is scrollable (because of the ListView). But what I need is that the entire green border is scrollable.
So I want to put everything in a <ScrollViewer><StackPanel></StackPanel></ScrollViewer>.
But when I do so, I occasionally get an out-of-memory exception (sometimes the apps just freezes and close without an exception).
Here is my not working xaml with the <ScrollViewer>:
<ScrollViewer>
<StackPanel>
<ListView x:Name="lstPredefinedCategories" ItemsSource="{Binding PredefinedCategories}" SelectionMode="Multiple" Margin="20">
<ListView.Header>
<StackPanel>
<TextBlock Text="Voorgestelde categorieën" Style="{StaticResource TextBlockStyle}" FontWeight="SemiBold" Foreground="Black" />
<Rectangle Style="{StaticResource DividerStyle}" Fill="Black"/>
</StackPanel>
</ListView.Header>
<ListView.ItemTemplate>
<DataTemplate>
<TextBlock Text="{Binding}" Style="{StaticResource TextBlockStyle}" HorizontalAlignment="Left" TextWrapping="Wrap" Width="300" />
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="Auto" />
<RowDefinition Height="Auto" />
<RowDefinition Height="Auto" />
<RowDefinition Height="*" />
<RowDefinition Height="Auto" />
<RowDefinition Height="Auto" />
</Grid.RowDefinitions>
<StackPanel Grid.Row="0" Margin="20,0">
<TextBlock Text="Alle categorieën" Style="{StaticResource TextBlockStyle}" FontWeight="SemiBold" Foreground="Black" />
<Rectangle Style="{StaticResource DividerStyle}" Fill="Black"/>
</StackPanel>
<TextBox x:Name="txtSearch" PlaceholderText="Zoek categorie" Grid.Row="1" Style="{StaticResource SearchboxStyle}" Margin="20,0" TextChanged="txtSearch_TextChanged" />
<Rectangle Grid.Row="2" Style="{StaticResource DividerStyle}" Margin="20, 0" />
<ListView x:Name="lstCategories" Grid.Row="3" Margin="20,10,20,0" ItemsSource="{Binding Categories}" SelectionMode="Multiple" SelectionChanged="lstCategories_SelectionChanged">
<ListView.ItemTemplate>
<DataTemplate>
<TextBlock Text="{Binding Key}" Style="{StaticResource TextBlockStyle}" HorizontalAlignment="Left" TextWrapping="Wrap" Width="300" />
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
<Rectangle Grid.Row="4" Style="{StaticResource DividerStyle}" Margin="20, 0" />
<Grid Grid.Row="5">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*" />
<ColumnDefinition Width="Auto" />
<ColumnDefinition Width="*" />
</Grid.ColumnDefinitions>
<Button x:Name="btnAnnuleren" Grid.Column="0" Content="Annuleren" Style="{StaticResource ButtonAnnulerenStyle}" Click="btnAnnuleren_Click"/>
<Rectangle Grid.Column="1" Fill="#A9A9A9" Width="0.5" Margin="10,0" />
<Button x:Name="btnSelecteren" Grid.Column="2" Content="Selecteren" Style="{StaticResource ButtonAnnulerenStyle}" Click="btnSelecteren_Click"/>
</Grid>
</Grid>
</StackPanel>
</ScrollViewer>
Any thoughts on why my app is freezing or get an OOM-exception?
Update
It comes because in the 2nd ListView they are too much objects loaded. So I'm gonna try to fix it with ISupportIncrementalLoading.
Or is there an other way?
The solution was to use virtualization (ISupportIncrementalLoading) like suggested in the comments.
Here you can find my implementation class of ISupportIncrementalLoading:
public class StringKeyValueIncrementalCollection : ObservableCollection<StringKeyValue>, ISupportIncrementalLoading
{
private List<StringKeyValue> allCategories;
private int lastItem = 1;
public StringKeyValueIncrementalCollection(List<StringKeyValue> categories)
{
this.allCategories = categories;
}
public bool HasMoreItems
{
get
{
if (lastItem == allCategories.Count)
{
return false;
}
else
{
return true;
}
}
}
public IAsyncOperation<LoadMoreItemsResult> LoadMoreItemsAsync(uint count)
{
CoreDispatcher coreDispatcher = Window.Current.Dispatcher;
return Task.Run<LoadMoreItemsResult>(async () =>
{
List<StringKeyValue> items = new List<StringKeyValue>();
for (int i = 0; i < count; i++)
{
items.Add(allCategories[i]);
lastItem++;
Debug.WriteLine(lastItem);
if (lastItem == allCategories.Count)
{
break;
}
}
await coreDispatcher.RunAsync(CoreDispatcherPriority.Normal,
() =>
{
foreach (StringKeyValue item in items)
{
this.Add(item);
}
});
return new LoadMoreItemsResult() { Count = count };
}).AsAsyncOperation<LoadMoreItemsResult>();
}
}
And then my code in the ViewModel. As you can see, I use the StringKeyValueIncrementalCollection instead of a regular List<object>:
private StringKeyValueIncrementalCollection categories;
private StringKeyValueIncrementalCollection allCategories;
public StringKeyValueIncrementalCollection Categories
{
get { return categories; }
set
{
filteredCategories = value;
RaisePropertyChanged("Categories");
}
}
public async void LoadCategories()
{
List<StringKeyValue> temp = await this.openVlaanderenService.GetCategoriesData();
allCategories = new StringKeyValueIncrementalCollection(temp);
Categories = allCategories;
}
The only problem that you than have is that the ScollViewer will allow it's content to fill as much space as it wants, so the data just will keep loading. To fix that I did what was suggested in ISupportIncrementalLoading inside ScrollViewer not supported?
So I added a SizeChanged="ScrollViewer_SizeChanged" event to my ScrollViewer and in code behind set the size of the ListView based on the viewport size properties of the ScrollViewer:
private void ScrollViewer_SizeChanged(object sender, SizeChangedEventArgs e)
{
lstCategories.Height = scrollViewer.ViewportHeight;
}
How do I set the text source for each image? I want a specific description for each image, but right now I have the same text for all of them. I was thinking of creating a folder in which to make 10 .txt files and set each image to have one of the files as a description.. but I only know how to do this theoretically. This is the instruction and the button that I'm talking about.
var files = Directory.GetFiles(#".\GalleryImages");
foreach (var file in files)
{
FileInfo fileInfo = new FileInfo(file);
WineModel wineModel = new WineModel();
wineModel.Image = new Uri(file, UriKind.Relative);
wineModel.Description = file + "text text text text text text text text text text text" +
Environment.NewLine + "text text text text text text text text text text text";
wineModel.Price = new Random().NextDouble();
BitmapImage bi = new BitmapImage();
bi.BeginInit();
bi.UriSource = wineModel.Image;
bi.EndInit();
var button = new KinectTileButton
{
Label = System.IO.Path.GetFileNameWithoutExtension(file),
Background = new ImageBrush(bi),
Tag = wineModel
};
this.wrapPanel.Children.Add(button);
}
This is the button
private void KinectTileButtonClick(object sender, RoutedEventArgs e)
{
var button = (KinectTileButton)e.Source;
var wineModel = button.Tag as WineModel;
var selectionDisplay = new SelectionDisplay(wineModel);
this.kinectRegionGrid.Children.Add(selectionDisplay);
e.Handled = true;
}
EDIT:this is the xaml code.. can you give me more details Stefan? I don't really understand what you're trying to say
<UserControl x:Class="Microsoft.Samples.Kinect.ControlsBasics.SelectionDisplay"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:k="http://schemas.microsoft.com/kinect/2013"
mc:Ignorable="d"
d:DesignHeight="300"
d:DesignWidth="300"
Background="Transparent"
FontFamily="Segoe UI"
FontSize="30">
<!--<Grid x:Name="layoutRoot">-->
<Grid x:Name="grid" Background="{StaticResource BlueBrush}" Width="auto">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="Auto" />
<ColumnDefinition Width="Auto" />
<ColumnDefinition Width="Auto" />
<ColumnDefinition Width="*" />
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition Height="Auto" />
<RowDefinition Height="*" />
<RowDefinition Height="Auto" />
</Grid.RowDefinitions>
<Image Grid.Row="0" Grid.Column="0" Grid.RowSpan="3" x:Name="Display" HorizontalAlignment="Left"
VerticalAlignment="Center" Height="185" Width="293" Margin="50,0,10,0" />
<TextBlock Grid.Row="0" Grid.Column="1" Grid.RowSpan="2" x:Name="Description" HorizontalAlignment="Left"
TextWrapping="Wrap" Text="" VerticalAlignment="Top" MaxHeight="400" MaxWidth="500"
Margin="0,20,0,0"/>
<TextBlock Grid.Row="2" Grid.Column="1" x:Name="Price" HorizontalAlignment="Left"
TextWrapping="Wrap" Text="" VerticalAlignment="Top" Height="85" Width="294"/>
<Viewbox Grid.Row="0" Grid.Column="3" MaxHeight="720" MaxWidth="1280" Margin="60 60 60 60">
<Canvas Width="1280" Height="720">
<k:KinectCircleButton Style="{StaticResource CancelButtonStyle}" Canvas.Right="-153" Canvas.Top="-153"
Foreground="White" Height="200" Width="200" Click="OnCloseFullImage" />
</Canvas>
</Viewbox>
</Grid>
<!--</Grid>-->
EDIT:This is xaml code
<UserControl x:Class="Microsoft.Samples.Kinect.ControlsBasics.SelectionDisplay"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:k="http://schemas.microsoft.com/kinect/2013"
mc:Ignorable="d"
d:DesignHeight="300"
d:DesignWidth="300"
Background="Transparent"
FontFamily="Segoe UI"
FontSize="30">
<!--<Grid x:Name="layoutRoot">-->
<Grid x:Name="grid" Background="{StaticResource BlueBrush}" Width="auto">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="Auto" />
<ColumnDefinition Width="Auto" />
<ColumnDefinition Width="Auto" />
<ColumnDefinition Width="*" />
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition Height="Auto" />
<RowDefinition Height="*" />
<RowDefinition Height="Auto" />
</Grid.RowDefinitions>
<Image Grid.Row="0" Grid.Column="0" Grid.RowSpan="3" x:Name="Display" HorizontalAlignment="Left"
VerticalAlignment="Center" Height="185" Width="293" Margin="50,0,10,0" />
<TextBlock Grid.Row="0" Grid.Column="1" Grid.RowSpan="2" x:Name="Description" HorizontalAlignment="Left"
TextWrapping="Wrap" Text="" VerticalAlignment="Top" MaxHeight="400" MaxWidth="500"
Margin="0,20,0,0"/>
<TextBlock Grid.Row="2" Grid.Column="1" x:Name="Price" HorizontalAlignment="Left"
TextWrapping="Wrap" Text="" VerticalAlignment="Top" Height="85" Width="294"/>
<Viewbox Grid.Row="0" Grid.Column="3" MaxHeight="720" MaxWidth="1280" Margin="60 60 60 60">
<Canvas Width="1280" Height="720">
<k:KinectCircleButton Style="{StaticResource CancelButtonStyle}" Canvas.Right="-153" Canvas.Top="-153"
Foreground="White" Height="200" Width="200" Click="OnCloseFullImage" />
</Canvas>
</Viewbox>
</Grid>
<!--</Grid>-->
I'm developing a player based on Silverlight 5 on MVVM pattern. I'm trying to change status buttons in code behind.
File : PlayerPage.xaml
My player component xaml :
<Grid x:Name="LayoutRoot">
<player:Player x:Name="Player"
Playlist="{Binding Playlist}"
CurrentPlaylistItem="{Binding CurrentPlaylistItem, Mode=TwoWay}"
IsSeekingEnabled="{Binding CanSeek}"
AutoLoad="True"
AutoPlay="True"
MediaEnded="Player_MediaEnded"
MediaOpened="Player_MediaOpened"
Style="{StaticResource PlayerStyle}"
PlaylistVisibility="Disabled"
LogLevel="Warning"
AutoHideControls="True"
AutoHideDelay="0:0:5"
AllowDoubleClickToggle="True"
RetryDuration="00:01:00"
RetryInterval="00:00:10"
BufferingTime="00:00:15"
/>
</Grid>
File : PlayerPage.xaml
Style of component player :
<Grid x:Name="ControllerContainer" Height="40" Grid.Row="4" RenderTransformOrigin="0.5,0.5">
<Grid.RenderTransform>
<CompositeTransform />
</Grid.RenderTransform>
<Grid.Background>
<ImageBrush ImageSource="component/Images/grid_background_player.jpg"
AlignmentY="Top" />
</Grid.Background>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="120" />
<ColumnDefinition Width="Auto" />
<ColumnDefinition />
<ColumnDefinition Width="Auto" />
<ColumnDefinition Width="Auto" />
<ColumnDefinition Width="Auto" />
<ColumnDefinition Width="Auto" />
</Grid.ColumnDefinitions>
<Grid x:Name="playercontrols" Grid.Column="0" HorizontalAlignment="Left" Width="90">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="Auto" />
<ColumnDefinition Width="Auto" />
<ColumnDefinition Width="Auto" />
<ColumnDefinition Width="Auto" />
<ColumnDefinition Width="Auto" />
</Grid.ColumnDefinitions>
<Grid Grid.Column="0">
<Button x:Name="TbPlayElement" Click="TbPlayElement_Click" HorizontalAlignment="Left" Cursor="Hand" >
<Grid>
<Image Source="component/Resources/play.png" Stretch="Uniform" Height="16" Width="16" />
</Grid>
</Button>
Now in my code behind PlayerPage.cs, when I press the stop button, I want to change the image of the play button.
private void TbStopElement_Click(object sender, System.Windows.RoutedEventArgs e)
{
}
How can I access the play button in code behind ?
Attach to the Loaded event to save a reference of the image:
xaml:
<Image Source="component/Resources/play.png" Stretch="Uniform" Height="16" Width="16"
Loaded="ImageLoaded" />
code-behind:
private Image imageReference;
private void ImageLoaded(object sender, EventArgs e)
{
imageReference = sender as Image;
}
Then when you want to change the image:
private void TbStopElement_Click(object sender, System.Windows.RoutedEventArgs e)
{
if(imageReference != null)
{
imageReference.Source = new BitmapImage(new Uri("/YourAppName;component/Resources/YourImage.png", UriKind.Relative));
}
}
Access in your TbStopElement like this:
var grid = TbPlayElement.Content as Grid;
var playImage = grid.Children[0] as Image;
BitmapImage bitmap = new BitmapImage();
bitmap.UriSource = new Uri("newImage.png", UriKind.Relative);
playImage.Source = bitmap;
I suggest you this code
TbPlayElement.Source = new BitmapImage(new Uri("/TbPlayElement.content;component/NameNewImage.png", UriKind.Relative));
Remark : Check properties in Visual Studio for the xaml file,ensure that Build Action is set to Page.
Or you can use ToggleButton
link : http://msdn.microsoft.com/en-us/library/cc296245%28v=vs.95%29.aspx
I've grid and button controls inside it.and what I want to get is row index and column index of clicked button .I'm new to silverlight so please help me
<UserControl
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
x:Class="testgrid.MainPage"
Width="640" Height="480">
<Grid x:Name="LayoutRoot" Background="Azure" Height="400" Width="400" >
<Grid.ColumnDefinitions >
<ColumnDefinition Width="100*" />
<ColumnDefinition Width="100*" />
<ColumnDefinition Width="100*" />
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition Height="100*" />
<RowDefinition Height="100*" />
<RowDefinition Height="100*" />
</Grid.RowDefinitions>
<Button x:Name="button1" Grid.Column="0" Grid.Row="0" Click="grid_Item_Click">
<Image x:Name="img1" Source="/testgrid;component/Images/kobe_bryant1.jpg" Stretch="Uniform" ></Image>
</Button>
<Button x:Name="button2" Grid.Column="1" Grid.Row="0" Click="grid_Item_Click">
<Image x:Name="img2" Source="/testgrid;component/Images/kobe_bryant1.jpg" Stretch="Uniform" ></Image>
</Button>
<Button x:Name="button3" Grid.Column="2" Grid.Row="0" Click="grid_Item_Click">
<Image x:Name="img3" Source="/testgrid;component/Images/kobe_bryant1.jpg" Stretch="Uniform" ></Image>
</Button>
<Button x:Name="button4" Grid.Column="0" Grid.Row="1" Click="grid_Item_Click">
<Image x:Name="img4" Source="/testgrid;component/Images/kobe_bryant1.jpg" Stretch="Uniform" ></Image>
</Button>
</Grid>
</UserControl>
and its page behind i have
private void grid_Item_Click(object sender, RoutedEventArgs e)
{
}
You can try this
private void grid_Item_Click(object sender, RoutedEventArgs e)
{
Button btn = sender as Button;
int x=(int)btn.GetValue(Grid.RowProperty);
int y=(int)btn.GetValue(Grid.ColumnProperty);
MessageBox.Show("row"+x.ToString()+"column"+y.ToString());
}