I've removed some code for brevity, but my problem is that images are not loading from resource project at runtime in included controls. The xaml is in a different project than the images, but both are in the same solution and the xaml project has the resource project as a reference.
The image loads from Source="/ThinkVisual.Resources;component/Images/save.png"/ but inside <my:OwnerDetails x:Name="controlOwnerDetails" /> there is an image which does not load.
<Button x:Name="btnAddOwnerDetails" ToolTip="Add Owner/Management details" Click="btnAddOwnerDetails_Click">
<Image Width="16" Height="16" Source="/ThinkVisual.Resources;component/Images/add_button.png" />
</Button>
Both the parent and the child controls are in the same project and folder.
<lc:LayoutGroup x:Name="layoutCompanyDetails" Header="Company Details" View="GroupBox" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Orientation="Vertical" <lc:LayoutGroup x:Name="tabCompanyDetails" View="Tabs" SelectedTabChildChanged="tabCompanyDetails_SelectedTabChildChanged">
<lc:LayoutGroup Header="Details">
<my:CompanyDetails x:Name="controlCompanyDetails" />
</lc:LayoutGroup>
<lc:LayoutGroup Header="Owner/Management Details">
<my:OwnerDetails x:Name="controlOwnerDetails" />
</lc:LayoutGroup>
</lc:LayoutGroup>
<lc:LayoutItem>
<StackPanel Orientation="Horizontal" HorizontalAlignment="Right">
<Button x:Name="btnUpdate" ToolTip="Update company details" Padding="0" Margin="0" Width="65" MouseEnter="Button_MouseEnter" MouseLeave="Button_MouseLeave" IsEnabled="{Binding Path=AllPropertiesValid}" Click="btnUpdate_Click">
<Button.Content>
<StackPanel Orientation="Horizontal">
<Image Width="16" Height="16" Source="/ThinkVisual.Resources;component/Images/save.png"/>
<Label x:Name="lblSaveButton" Padding="2">Update</Label>
</StackPanel>
</Button.Content>
</Button>
</StackPanel>
</lc:LayoutItem>
The images are visible in Visual Studio but not displayed during execution, project builds and runs without error.
You're using the wrong Pack URI
Make sure your Image in your custom control library is set to Resource Build Action and False for Copy to Output Directory.
Then change your Image.Source to:
<Image Width="16"
Height="16"
Source="pack//application:,,,/ThinkVisual.Resources;component/Images/add_button.png" />
Personally, I would put all the images used in XAML in the same project as the XAML to break the dependency. Image if someone took your assembly and wanted to reuse it. They would need to create a new project with the same naming convention and file names in order to use the assembly with it's intention.
If the image is used in both assemblies (projects), add the images to each assembly and use proper Pack Uri's.
So if you're using the image in a control defined in ThinkVisual.Administration then use
Source="pack//application:,,,/ThinkVisual.Adminstration;component/Images/add_button.png"
and if the control you're using in ThinkVisual.Resources uses the same image, then use the first snippet for Source.
Related
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
My app is published in Windows Store now, but when I install it from the store, all of my custom images are missing. When I install via debugger from VisualStudio everything is fine. Is there maybe a missing resource note in appxmanifest for using custom images, by any chance?
Example:
<Button x:Name="myBtn" Grid.Row="0" Tapped="myBtn_Tapped" Style="{StaticResource ButtonStyleMenu}" BorderThickness="0" ClickMode="Press">
<StackPanel Orientation="Horizontal">
<Image x:Name="alert" Stretch="Fill" Source="ms-appx:///Assets/my/menu/btn.scale-100.png" Margin="10,0,0,0" Width="25" Height="25" HorizontalAlignment="Center" VerticalAlignment="Center"/>
<TextBlock x:Name="btnTxt" Text="ClickMe" FontSize="18" Foreground="White" Margin="10,0" VerticalAlignment="Center"/>
</StackPanel>
</Button>
You should not be looking for a qualified asset, like btn.scale-100.png. Instead, you should look for an unqualified asset like btn.png, and Windows will automatically load the right resource depending on the scale-factor of the OS.
This article does explain the concept at some depth: https://blogs.windows.com/buildingapps/2013/08/08/developing-world-ready-apps-in-xaml-part-2/
I have MessageDialog code like this:
MessageDialog dlg = new MessageDialog("None of the images you selected contain location information. You can add your own after downloading http://exifpilot.com/");
await dlg.ShowAsync();
Rather than just have it display like that (with raw/boring text), I want to make the link clickable. Is it possible to embed a HyperlinkButton into the MessageDialog as one of its buttons, or better yet, make the appropriate portion of the text clickable/tappable? Can XAML or HTML be used as the text value to accomplish this, or is nigh on to impossible?
UPDATE
I have installed Version 1.4.0.0 of Callisto and it is , but with this XAML:
<Page
. . .
xmlns:Controls="using:Callisto.Controls"
mc:Ignorable="d">
<callisto:CustomDialog x:FieldModifier="public" x:Name="GetPhotosetName"
Title="Photoset Name"
Background="Teal" BackButtonVisibility="Visible">
<StackPanel>
<TextBlock Margin="0,0,0,8" FontSize="14.6667" FontWeight="SemiLight" TextWrapping="Wrap">
Enter a name for the photoset you are creating
</TextBlock>
<TextBlock Margin="0,0,0,8" FontSize="14.6667" FontWeight="SemiLight" Text="Enter your name for acceptance" />
<callisto:WatermarkTextBox HorizontalAlignment="Left" Watermark="Enter the photoset name" Width="400" Height="35" />
<StackPanel Margin="0,20,0,0" HorizontalAlignment="Right" Orientation="Horizontal">
<Button Content="OK" Width="90" Margin="0,0,20,0" />
<Button Content="CANCEL" Width="90" Click="DialogCancelClicked" />
</StackPanel>
</StackPanel>
</callisto:CustomDialog>
...I get several err msgs, such as "The type 'callisto:CustomDialog' was not found. Verify that you are not missing an assembly reference and that all referenced assemblies have been built." and "The namespace prefix "callisto" is not defined." and "CustomDialog is not supported in a Windows App project."
UPDATE 2
Note: I changed the XAML a smidgen, from:
callisto:WatermarkTextBox x:Name="txtbxPhotosetName" HorizontalAlignment="Left" Watermark="Enter the photoset name" Width="400" Height="35" />
...to:
<TextBox x:Name="txtbxPhotosetName" HorizontalAlignment="Left" PlaceholderText="Enter the photoset name" Width="400" Height="35" />
...because of a warning advising me that the watermark functionality is now available natively for TextBoxes via the PlaceholderText property.
No. The MessageDialog is not customisable, but you can create your own control which mimics the look and feel of the MessageDialog (plus your custom enhancements).
There are several turnkey custom dialogs available (such as in http://callistotoolkit.com/ ) or you can cobble a one-shot pretty easily. A minimum version could be a popup containing a three row Grid with a partially transparent background and the TextBlock with Hyperlink in the centre row.
Also consider if a MessageDialog is the right way to surface the error rather than showing the error message inline. See Guidelines for Message dialogs and Choosing the right UI surfaces: Errors.
--Rob
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.
I find that there is some item templates, data templates and binding in the .xaml file for listbox. Is there any way to create it in code behind?
Is there any way to create data templates programataically?
this is the XAML CODE,BUT I need in code behind using c# not in XAML,because
am working in dynamic list box creation with adding itemtemplatem,datatemplate
<ListBox Height="520" HorizontalAlignment="Left" Margin="0,6,0,0" Name="lstimge" VerticalAlignment="Top" Width="450" >
<ListBox.ItemTemplate>
<DataTemplate>
<StackPanel Orientation="Horizontal">
<Image Source="{Binding Image}" Width="150" Stretch="Uniform" HorizontalAlignment="Center" />
<TextBlock Text="{Binding FileName}" TextWrapping="Wrap" />
</StackPanel>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
Kindly give the solution
Thanks,
Ashok
You can't build templates from code - this can only be done from XAML.
If you dynamically generated the template XAML in your code, you could load it as described here.
I suspect you'll find yourself opening a whole can of worms if you go down this route. As an alternative, you could predefine a set of templates, and choose the correct one dynamically at runtime, as described here
You could use XamlReader.Load to dynamically load XAML in code-behind and cast it to a DataTemplate, later assigning it to the ItemTemplate. Here is an example.
Is the DataTemplate that you want to use the same for all listboxes or is that also dynamically generated? If it is the same for all of them then you could save it as a Style in your Resources and then just create the Listbox object dynamically and apply the style.