Add background image to wp8 app - c#

Hello i tried to add background image to one of my project pages , I am new to xmal and i need some help to understand why i cant see the background when i run the emulator.
<phone:PhoneApplicationPage
x:Class="ipublicSrv.Pages.MusicMenuPage"
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"
FontFamily="{StaticResource PhoneFontFamilyNormal}"
FontSize="{StaticResource PhoneFontSizeNormal}"
Foreground="{StaticResource PhoneForegroundBrush}"
SupportedOrientations="Portrait" Orientation="Portrait"
mc:Ignorable="d"
shell:SystemTray.IsVisible="True">
<!--LayoutRoot is the root grid where all page content is placed-->
<Grid x:Name="LayoutRoot" >
<Grid.RowDefinitions>
<RowDefinition Height="Auto"/>
<RowDefinition Height="*"/>
</Grid.RowDefinitions>
<Grid.Background>
<ImageBrush ImageSource="C:\Users\lior\Documents\Visual Studio 2013\Projects\IPubProject\ipublicSrv\ipublicSrv\Resources\24796-armin-van-buuren.jpg"
Stretch="UniformToFill" />
</Grid.Background>
<!--TitlePanel contains the name of the application and page title-->
<StackPanel Grid.Row="0" Margin="12,17,0,28">
<TextBlock Text="Music Menu" Margin="9,-7,0,0" Style="{StaticResource PhoneTextTitle1Style}"/>
</StackPanel>
<!--ContentPanel - place additional content here-->
<Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0">
</Grid>
</Grid>
</phone:PhoneApplicationPage>

Looks like you are using Image from Your Computer.Please add image in your project with Build type Content.then give correct path as :
ImageSource="/Resources/Images/yourImage.png //if you added image in `Resource/Image` folder.
Hope this Helps.Cheers.

Check if the build action is set to "content". That might be causing the issue.
And also check the path of the image that you are using. It has to be inside your project. Ideally inside the assets folder. or somewhere separately.
Hope it helps. Cheers.

Don't add your PC address. It won't run on emulator. Since the address isn't resolved. Add the background image in the Assets or any folder in your solution then use
ImageSource = "Assets/background.png"
Assuming you have image in Assets folder named background.png

Related

C# Windows IoT core - Auto Scroll text in Textblock from left to right continuously

I am working on a Digital Signage project using Windows IoT core. So far I managed to design the grid and scroll images and videos. Now I have added a text block at the bottom of the grid and text in it should continuously scroll from left to right
For more detail example I need a MARQUEE of text in the bottom side.
Main page XAML code:
<Page
x:Class="Digital_Notiec_Board_V1._2.MainPage"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="using:Digital_Notiec_Board_V1._2"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d">
<Grid Background="#FF222222" HorizontalAlignment="Stretch" VerticalAlignment="Stretch">
<Grid.RowDefinitions>
<RowDefinition MaxHeight="1800"></RowDefinition>
<RowDefinition Height="20"></RowDefinition>
</Grid.RowDefinitions>
<Image x:Name="imageInstance" Visibility="Collapsed" Grid.Row="0"/>
<MediaElement x:Name="audioInstance" Visibility="Collapsed" Grid.Row="0"/>
<MediaElement x:Name="videoInstance" Visibility="Collapsed" Grid.Row="0"/>
<ScrollViewer Grid.Row="1" Background="#FF5A80FF">
<TextBlock x:Name="ScrollText" TextWrapping="Wrap" Foreground="White" Text="AJ Y" ScrollViewer.HorizontalScrollBarVisibility="Disabled" ScrollViewer.VerticalScrollBarVisibility="Disabled" ScrollViewer.HorizontalScrollMode="Auto" SelectionHighlightColor="#FF2D5DFF">
</TextBlock>
</ScrollViewer>
</Grid>
Well if you need to show a Marquee text only then I would advise you to use a custom control that allows you to put a text as a marquee.
Luckily, there is a GitHub repo for the same. You can check it out on `GitHub at MarqueeTextControl
works perfectly fine, I just tried it. If you need any further help, please use the comments section.

Changing size of User Control

I'm having a problem with determining which element is responsible for a size misalignment. Here is a picture to illustrate it: click here to see it
The light grey area is the element size which I am trying to change, but cannot. The overall area is a User Control, the area inside the Tab is a WPF (as an element Host). I've tried changing both, but with no effect on the grey area (the other tabs are also affected by this). Here is the code for the hosted element (WPF):
<UserControl x:Class="SlideAnalyzer.DisplayAnalysis"
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:local="clr-namespace:SlideAnalyzer"
mc:Ignorable="d"
d:DesignHeight="150.8" d:DesignWidth="201.2">
<Grid Name="displayGrid" Height="64" VerticalAlignment="Bottom" HorizontalAlignment="Center" Width="160" Margin="10,0,31.6,9.4" RenderTransformOrigin="0.496,0.94">
<Grid.RowDefinitions>
<RowDefinition Height="Auto" />
<RowDefinition Height="Auto" />
<RowDefinition Height="Auto" />
</Grid.RowDefinitions>
<Expander x:Name="expander" Grid.Row="0" Header="Titel zu lang" HorizontalAlignment="Left" VerticalAlignment="Top" Width="180" Background="Red" Margin="-10,-56,0,0">
<Grid Background="AliceBlue">
<TextBlock TextWrapping="Wrap"
Margin="5"><Run Text="This is some text content."/></TextBlock>
</Grid>
</Expander>
</Grid>
The host itself is a normal User Control. I cannot seem to get the right size of the hosted element so that the preview really reflects reality (because when I run the Add-In, the size of the WPF differs)
I tried changing the Properties of the UserControl and I found that AutoSize has a big impact when True (by default False)
Thanks!

How to get rid of a XamlParseException?

This is my xaml code. This parses an exception. I cannot find what is wrong there. Can someone point it to me?. This is a windows phone application,
XAML
<phone:PhoneApplicationPage
x:Class="Citysearch.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.RowDefinitions>
<RowDefinition Height="Auto"/>
<RowDefinition Height="*"/>
</Grid.RowDefinitions>
<!--TitlePanel contains the name of the application and page title-->
<StackPanel x:Name="DisplayPanel" Grid.Row="0" Margin="12,17,0,28">
<TextBlock Text="Display city" Style="{StaticResource PhoneTextNormalStyle}" Margin="12,0"/>
<TextBlock Text="City recog" Margin="9,-7,0,0" Style="{StaticResource PhoneTextTitle1Style}"/>
</StackPanel>
<!--ContentPanel - place additional content here-->
<Grid x:Name="ContentPanel" Margin="14,151,10,10" Grid.RowSpan="2">
<TextBox HorizontalAlignment="Left" Height="72" Margin="119,143,0,0" TextWrapping="Wrap" VerticalAlignment="Top" Width="309" TextChanged="TextBox_TextChanged_1"/>
<TextBlock HorizontalAlignment="Left" Margin="47,168,0,0" TextWrapping="Wrap" Text="city" VerticalAlignment="Top"/>
</Grid>
</Grid>
<phone:PhoneApplicationPage.ApplicationBar>
<shell:ApplicationBar>
<shell:ApplicationBarIconButton x:Name="Reco1" IconUri="appbar.micph.rest.png" Text="mic" Click="Reco1_Click" />
</shell:ApplicationBar>
</phone:PhoneApplicationPage.ApplicationBar>
</phone:PhoneApplicationPage>
The error that I get is shown below:
XamlParseException occurred : A first chance exception of type 'System.Windows.Markup.XamlParseException' occurred in System.Windows.ni.dll
It occurs on this line:
<shell:ApplicationBarIconButton x:Name="Reco1" IconUri="appbar.micph.rest.png"
Text="mic" Click="Reco1_Click" />
Finally I got it.
I did this first:
Debug->Exceptions
Press Add and type in,
"System.Windows.Markup.XamlParseException"
and select Common Language Runtime Exceptions,
then it gave me the exact place of where this happens.
Then I removed
Click="Reco1_Click"
So now it works fine.
What we can tell you about your problem will be severely limited from the information that you have provided. The first thing to note is that that error is a very generic error and is raised for a great many different reasons... it generally has nothing to do with the XAML, but instead points to an error in a control defined in XAML.
You say that your error occurs on this line:
<shell:ApplicationBarIconButton x:Name="Reco1" IconUri="appbar.micph.rest.png"
Text="mic" Click="Reco1_Click" />
This gives you a few possibilities:
You could have a problem with your ApplicationBarIconButton control.
You could have a problem with your IconUri property value (although you should get a compilation error if this was the case)
You could have a problem with the code in your Reco1_Click handler
In my opinion, it is most likely that you have some code in (or started from) the constructor of your ApplicationBarIconButton control that is invalid. These types of problems can be difficult to eradicate, but if you just experiment by commenting out different (relevant) parts of the code and trying to run the application again each time, then you should eventually find the problem.

Windows Phone 8 XAML Editor setting variables to null at runtime

I've been trying to add a simple TextBlock control to my Windows Phone 8 app, however once I assign it a name in the GUI XAML editor and attempt to access the control via its assigned name in the C# code at runtime I get "NullReferenceExceptions" because the variable is never set.
I have narrowed the problem down to the PhoneApplicationPage method "FindName" i.e.
PhoneApplicationPage.FindName("videoName");
However a call like this to some of my controls (created in the GUI editor) simply return null. Has anybody had this problem and found a fix?
Regards.
The contents of the InitialiseComponent() method:
public void InitializeComponent() {
if (_contentLoaded) {
return;
}
_contentLoaded = true;
System.Windows.Application.LoadComponent(this, new System.Uri("/Youtube%20Downloader;component/MainPage.xaml", System.UriKind.Relative));
this.LayoutRoot = ((System.Windows.Controls.Grid)(this.FindName("LayoutRoot")));
this.TitlePanel = ((System.Windows.Controls.StackPanel)(this.FindName("TitlePanel")));
this.ContentPanel = ((System.Windows.Controls.Grid)(this.FindName("ContentPanel")));
this.videoName = ((System.Windows.Controls.TextBlock)(this.FindName("videoName")));
this.videoImage = ((System.Windows.Controls.Image)(this.FindName("videoImage")));
}
(The videoName and videoImage controls are the ones not getting added)
The XAML code is (that the editor has generated):
<phone:PhoneApplicationPage
x:Class="Youtube_Downloader.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">
<Grid x:Name="LayoutRoot" Background="Transparent">
<Grid.RowDefinitions>
<RowDefinition Height="Auto"/>
<RowDefinition Height="*"/>
</Grid.RowDefinitions>
<StackPanel x:Name="TitlePanel" Grid.Row="0" Margin="12,17,0,28">
<TextBlock Text="YOUTUBE DOWNLOADER" Style="{StaticResource PhoneTextNormalStyle}" Margin="12,0"/>
</StackPanel>
<!--ContentPanel - place additional content here-->
<Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0">
<TextBlock x:Name="videoName" Margin="10,10,0,0" TextWrapping="Wrap" Text="TextBlock" VerticalAlignment="Top" Height="56" FontSize="36" FontStyle="Normal"/>
<Image x:Name="videoImage" HorizontalAlignment="Center" Height="408" Margin="0,72,0,0" VerticalAlignment="Top" Width="446"/>
</Grid>
</Grid>
I had the same problem. Clean project will fix it.

showing Image swapping like picture gallery in Windows Phone C#

I am not able to make smooth swapping like image gallery in windows phone.
I tried flip gesture listener and its able to swap image but its not swapping smoothly.
I tried to search but didn't got any answer. I am trying to show a list of images in gallery view manner.I am struggling from past 3 days. Please it will be a help if you give me some suggestion or link.
This is a simple example i just built to show you how it has to be done.. hope u find it helpful
<phone:PhoneApplicationPage xmlns:Controls="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone.Controls"
x:Class="PhotoChooser.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" d:DesignWidth="480" d:DesignHeight="768"
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.RowDefinitions>
<RowDefinition Height="Auto"/>
<RowDefinition Height="*"/>
</Grid.RowDefinitions>
<!--TitlePanel contains the name of the application and page title-->
<StackPanel x:Name="TitlePanel" Grid.Row="0" Margin="12,17,0,28">
<TextBlock x:Name="ApplicationTitle" Text="MY APPLICATION" Style="{StaticResource PhoneTextNormalStyle}"/>
<TextBlock x:Name="PageTitle" Text="page name" Margin="9,-7,0,0" Style="{StaticResource PhoneTextTitle1Style}"/>
</StackPanel>
<!--ContentPanel - place additional content here-->
<Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0">
<ListBox x:Name="lbImages">
<ListBox.ItemTemplate>
<DataTemplate>
<Controls:Panorama>
<Controls:PanoramaItem>
<Image Source="{Binding ImageName}"/>
</Controls:PanoramaItem>
</Controls:Panorama>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
</Grid>
</Grid>
and the class file for this designer goes something like this
public partial class MainPage : PhoneApplicationPage
{
public MainPage()
{
InitializeComponent();
PanoramaItem panItem = new PanoramaItem();
List<ImageList> imgList = new List<ImageList>();
imgList.Add(new ImageList() { ImageName = ImagePath.Image4 });
lbImages.ItemsSource = imgList;
}
public class ImageList
{
public string ImageName { get; set; }
}
}
This actually works smoothly and looks good too.. There are few more ways to achieve what you are trying. Do let me know if this works or not. I will suggest others if this doesn't work for u!

Categories

Resources