Where is the "ListViewItemPlaceholderBackgroundThemeBrush" located? - c#

I have a problem understanding one style definition in Windows 8 metro apps.
When you create a metro style application with VS, there is also a folder named
Common
created. Inside this folder there is file called
StandardStyles.xaml
Now the following snippet is from this file:
<!-- Grid-appropriate 250 pixel square item template as seen in the GroupedItemsPage and ItemsPage -->
<DataTemplate x:Key="Standard250x250ItemTemplate">
<Grid HorizontalAlignment="Left" Width="250" Height="250">
<Border Background="{StaticResource ListViewItemPlaceholderBackgroundThemeBrush}">
<Image Source="{Binding Image}" Stretch="UniformToFill"/>
</Border>
<StackPanel VerticalAlignment="Bottom" Background="{StaticResource ListViewItemOverlayBackgroundThemeBrush}">
<TextBlock Text="{Binding Title}" Foreground="{StaticResource ListViewItemOverlayForegroundThemeBrush}" Style="{StaticResource TitleTextStyle}" Height="60" Margin="15,0,15,0"/>
<TextBlock Text="{Binding Subtitle}" Foreground="{StaticResource ListViewItemOverlaySecondaryForegroundThemeBrush}" Style="{StaticResource CaptionTextStyle}" TextWrapping="NoWrap" Margin="15,0,15,10"/>
</StackPanel>
</Grid>
</DataTemplate>
What I do not understand here is the static resource definition, e.g. for the Border
Background="{StaticResource ListViewItemPlaceholderBackgroundThemeBrush}"
It is not about how you work with templates and binding and resources.
Where is this ListViewItemPlaceholderBackgroundThemeBrush located?
Many thanks for your help.
Dimi

In Windows 8 customer preview you can find the file containing the resources' definition (including ListViewItemPlaceholderBackgroundThemeBrush) at:
C:\Program Files (x86)\Windows Kits\8.0\Include\winrt\xaml\design\themeresources.xaml

This is one of those incredibly frustrating things that should be in Microsoft's documentation, but isn't (yet).
ListViewItemPlaceholderBackgroundThemeBrush is one of the System Brush Resources. It's defined by the Metro "Light" or "Dark" theme (whichever you selected for your app).
You can see the full list of system brushes in Blend. (Unfortunately, I haven't found any way to enumerate them in code. There doesn't seem to be any programmatic way to inspect the theme resources.)
Here are some steps that will get you to the full list. (Of course, you can abbreviate the steps if you're already familiar with Blend.)
Open Expression Blend.
Create a new project, and select XAML (Windows Metro style) > Blank App (XAML) and click OK.
Click in the design surface to select the Grid. (In the "Objects and timeline" docked window in the lower-left, the "[Grid]" line will become highlighted.)
In the Properties docked window in the upper right, find the "Brush" category.
Right below where it says "Background: No brush", there's a row of five buttons. Click the rightmost button ("Brush resources").
The list of system brush resources will appear in the listbox.

Related

WPF-XAML: Images disappear in designer after running

I am creating an application on Visual Studio 16.3 and I have created some buttons with images on them. Everytime I run the application, the image appear in runtime but when I close the build, all the images disapear in the designer and it's very annoying. I have to cut the code that contains the image references and wait around 1 to 2 seconds and paste the code again to make the image reappear. Here is my code:
In my MainWindow, I have created resources so that I can reuse the images:
<Window.Resources>
<BitmapImage x:Key="Students" UriSource="Resources/Graduate/2x/baseline_student_black_18dp.png"/>
</Window.Resources>
I have created a side menu containing names and images:
<ListView x:Name="ListViewMain" Grid.Row="1" Background="Transparent" SelectionMode="Single" ScrollViewer.HorizontalScrollBarVisibility="Disabled" SelectionChanged="ListViewMain_SelectionChanged">
<ListViewItem Width="128" x:Name="ItemClass" HorizontalAlignment="Left">
<StackPanel Orientation="Horizontal">
<Image Margin="5" Source="{DynamicResource Students}"/>
<TextBlock Text="Home" VerticalAlignment="Center" FontSize="14" Foreground="#FF606060"/>
</StackPanel>
</ListViewItem>
</ListView>
I have spent a quite amount of time on the internet trying to find out why this is happening but I haven't found anything. Most of the questions are related to images not appearing in runtime while my problem is that my images do not appear in designer.
Might this be related to the fact that I am using .Net Core 3? I know there are a lot of bugs in Visual Studio. Maybe this is one of them.
Thanks in advance for your help

FlipView is not accessible in simple WPF application

Windows has this beautiful control FlipView.
When I want to add it to my xaml page, VS can find it source (I've checked, Windows library is included into project). So I found suggestion to create own class which will be inherited from FlipView class. After I did it, VS said it can't find definition of <FlipView.ItemTemplate>. So what I am doing wrong?
Code which I've used to test FlipView
<FlipView x:Name="flipView1" Width="480" Height="270"
BorderBrush="Black" BorderThickness="1">
<FlipView.ItemTemplate>
<DataTemplate>
<Grid>
<Image Width="480" Height="270" Source="{Binding Image}" Stretch="UniformToFill"/>
<Border Background="#A5000000" Height="80" VerticalAlignment="Bottom">
<TextBlock Text="{Binding Name}" FontFamily="Segoe UI" FontSize="26.667"
Foreground="#CCFFFFFF" Padding="15,20"/>
</Border>
</Grid>
</DataTemplate>
</FlipView.ItemTemplate>
</FlipView>
FlipView is a Windows Store/Universal App only class.
The page you link to clearly states:
Requirements (Windows 10 device family)
Device family
Universal
and
Requirements (Windows 8.x and Windows Phone 8.x)
Minimum supported client
Windows 8 [Windows Store apps only]
If you want to have the same functionality in a WPF desktop application you will need to either find a third party control that does the same or write your own.

WPF panel header title

I am not sure they correct terminology for a header/title bar of a component in WPF. What I need is a panel/non-floating window, in which I can set the title? I want a few components in a panel that needs a title like Properties and Toolbox in Visual Studio.
As mentioned earlier, this doesn't need to be a floating/docking panel. I don't want GroupBox. I will be adding close button later just to hide the component from the user.
I think, that in WPF visual solutions are limited only by our imagination.
If there isn't the control you want - you can build it.
My simple solution is here:
<Border Visibility="Visible" BorderThickness="2" BorderBrush="Blue" CornerRadius="8" Margin="30,30,30,30">
<StackPanel Margin="3">
<Label Height="25" Content="H e a d e r" Background="LightSkyBlue" />
<Separator Height="5"/>
<Grid>
<!-- content -->
</Grid>
</StackPanel>
</Border>
Changing Visibility="Collapsed" you can hide this "panel".
If you don't need it to undock and float then you can use a HeaderedContentControl.
When you want to add the close button you can template the header presenter to include a button.

ItemDroppedOnTarget in DragDropTarget should have target element

I'm using DragDropListBoxTarget control from Silverlight Toolkit to support the drag and drop behavior. But I'm facing with a problem with this control.
It's hard to get hold of target element on which the item is dropped. It is a must to have thing in ItemDroppedOnTarget event arguments.
When I drag an item, I need when the user drops it, an intermediate event should modify the target Item. But I can't find the way to implement it.
Am I using the right control, or what another alternatively do I have?
I had the same problem. I ended up using this drag-drop tool. I recompiled the source for Silverlight 5. It lets me know the target. I was also lazy and still wanted the ghost-drag pic of whatever you're dragging when using the toolkit DragDropTarget controls, so I kept my source wrapped in that and also wrapped in the new drag-drop tool.
The way I defined the dragging:
<toolkit:ListBoxDragDropTarget AllowedSourceEffects="Copy">
<ListBox ItemsSource="{Binding Path=UnitOfWork.Templates}" Width="130" Height="360" BorderThickness="0">
<ListBox.ItemTemplate>
<DataTemplate>
<StackPanel>
<dd:DragSource>
<TextBlock Text="{Binding Path=Name}" Width="120"/>
</dd:DragSource>
</StackPanel>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
</toolkit:ListBoxDragDropTarget>
<dd:DropTarget Grid.Row="2" AllowDrop="True" OnDropped="Target_OnDropped">
<Border BorderBrush="Black" BorderThickness="1" Width="98" Height="30">
<TextBlock Text="Drop Here" HorizontalAlignment="Center" VerticalAlignment="Center"/>
</Border>
</dd:DropTarget>
This way keeps the dragging ghost that the ListBoxDragDropTarget creates, while allowing me to use the dd:DragSource and dd:DropTarget controls to allow finer-grained drag-drops.

Bing Maps Silverlight - Adding tooltips to pins generated in C#

I am attempting to convert a bing map implementation that uses standard PushPins in order to populate the map, but I need to add a tooltip to each pin. I found some options of how to do this on the website but the issue is I need the pushpins to be different from each other in a way that is dynamic. Based on the properties of each pin it must have a different background color.
The code already on this site all has the programmer use an image of the pushpin when they customize it.
So right now I need a way to either create a templated pushpin that is able to maintain the look and properties of a pushpin (so I can set background), while allowing a tooltip. Or instead having a regular pushpin have a tooltip or popup with it.
Any help would be appreciated!
Edited:
Control Template I am using
<ControlTemplate x:Key="NewPins" >
<Grid x:Name="pushPin" >
<Popup IsOpen="False" behaviors:RolloverPopup.HideDelay="0" behaviors:RolloverPopup.Target="{Binding ElementName=pushPin}" Margin="30,-20,0,0" >
<Border Background="White" BorderBrush="Black" CornerRadius="10" BorderThickness="1">
<StackPanel Orientation="Vertical" >
<TextBlock Text="{Binding Title}" Foreground="Black" FontWeight="Bold" TextWrapping="Wrap" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Margin="10" />
<TextBlock Text="{Binding Content}" Foreground="Black" TextWrapping="Wrap" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Margin="10" />
</StackPanel>
</Border>
</Popup>
</Grid>
</ControlTemplate>
This is setting up the pin in C#
Pushpin pin = new Pushpin()
{
Location = new Location( Double.Parse(item.PinLat), Double.Parse(item.PinLong)),
Content=String.Concat( GetNewlineString(item.LocationName), GetNewlineString(item.CallerName), GetNewlineString(item.PhoneNumber)),
Template=(ControlTemplate)Application.Current.Resources["NewPins"],
Width = 50,
Height = 65,
};
And this is creating the Bing Map
<c:BingMapAdSmart
AnimationLevel="UserInput"
Pins="{Binding DashboardViewModel.MapPins}"
NavigationVisibility="Visible"
SetViewZoomFactor="0"
MaxZoomLevel="7"
Visibility="{Binding NavViewModel.IsViewTransitioning, Converter={StaticResource TrueToCollapsedConverter}}" />
I may not really understand your question correctly, but i assume you need pushpins that are being created dynamically based on a template right? And you want to be able to change the tooltip (content property i assume) independently.
If thats the case, first you need to put a template resource to your resources in xaml;
<phone:PhoneApplicationPage.Resources>
<ControlTemplate x:Key="template_name" TargetType="m:Pushpin">
...this is your design part you can compile this xaml via Expression
</ControlTemplate>
</phone:PhoneApplicationPage.Resources>
then you'll need pass this value to every pushpin you've created dynamically codebehind. On this stage you can also set their content property, since they don't have a notification property, i don't know if you mean this but content property is the similar one. You can edit them like you edit other stuff;
myPushPin.template = (ControlTemplate)This.Resources["template_name"];
myPushPin.Content = "Hello World!";
This stage may differ according where you put your resources if its in phone:PhoneApplicationPage.Resources
if you put in Application.Resources
use this;
myPushPin.template = (ControlTemplate)Application.Current.Resources["template_name"];
myPushPin.Content = "Hello World!";
This should work, i don't have bing maps API or WP7 tools installed on this computer so i can't test it but this should be ok.
Happy coding!
Edit:
So if you want to change the background of a pushpin you don't have to hold back, it doesn't matter whether it has a control template or not. Actually every control has one as default. You can change the background as you always do
myPushpin.Background = new SolidColorBrush(Colors.Blue);
I have done exactly what you describe. The way i did this makes the most sense to me. Here is what I did:
I created a custom Pushpin (i.e. UserControl). This Xaml defines my custom pushpin. It assumes this pushpin is to be data-bound to. One of the binded properties is background Color. This will easily satisfy your dynamic color issue.
In the bing map control i defined the following:
The MyPushpinTemplate is defined in the UserControl.Resources like this:
MyPushpinControl is the UserControl.
I also have a data model class (that implements INotifyPropertyChanged). This class is bound to an instance of MyPushpinControl. this data model class has all the properties and is data-binded to the UserControl.
This is technically all you need to know.
To satisfy your tooltip issue, I simply added a tooltip to one of the panels within my custom pushpin. Simple as that.
Until I have a better solution I have decided the only thing I can think to do is to create a number of different pins to use. I don't need an infinite color solution so about 15 different pins should do the trick. Messy but it will work.
I just solved this issue to my complete satisfaction. To accomplish this, you need to have to create a Pushpin style with a key. Then inside this pushpin you create a standard pushpin (you can use another style on that but don't let it look back to this style, I used default), and a popup to go along with it. An example is below, I am using a local tool to do easy rollover popups, otherwise its standard stuff + bind maps.
<Style TargetType="bingMaps:Pushpin" x:Key="NewPins2">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="bingMaps:Pushpin" >
<Grid x:Name="pushPin" >
<Border Width="50" Height="65" >
<bingMaps:Pushpin Background="{TemplateBinding Background}" />
</Border>
<Popup IsOpen="False" behaviors:RolloverPopup.HideDelay="0" behaviors:RolloverPopup.Target="{Binding ElementName=pushPin}" Margin="30,-20,0,0" >
<Border Background="White" BorderBrush="Black" CornerRadius="10" BorderThickness="1">
<StackPanel Orientation="Vertical" >
<TextBlock Text="{Binding Title}" Foreground="Black" FontWeight="Bold" TextWrapping="Wrap" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Margin="10" />
<TextBlock Text="{Binding Content}" Foreground="Black" TextWrapping="Wrap" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Margin="10" />
</StackPanel>
</Border>
</Popup>
</Grid>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>

Categories