Adding a custom font to a windows phone 8 app - c#

I've read articles such as this 31 days of windows phone day 24 embedding-fonts and this windows 8 xaml tips custom fonts that explain very clearly and simply how to do this.
But for some reason I can't figure out, my custom font doesn't show on my app, whether in the designer view or when I run it.
To be sure I haven't left any step out, I'm showing what I did here for any suggestions on what my issue might be:
1. First, this is my xaml textblock code
<StackPanel Grid.Row="1" x:Name="BottomPanel" Height="120" Width="800" Orientation="Horizontal">
<StackPanel.Background>
<SolidColorBrush Color="{StaticResource PhoneSemitransparentColor}"/>
</StackPanel.Background>
<TextBlock x:Name="MainTextBlock" FontFamily="/Fonts/KOMIKAX_.ttf" TextWrapping="Wrap" Text="Hello" Width="680" Height="120" Margin="10,0,0,0" FontSize="25" Padding="20,10"/>
</StackPanel>
2. I created a folder in my project, called it "Fonts" and that is where I copied my font file.
3. I changed the Build Action of the font file to Content. I left the Copy To Output Directory property as None at first, then changed it to Copy If Newer. No success.
What have I done wrong or what did I leave out?

This work for me.
First make a folder in your App with the name Fonts, then Add font to it, then use the following syntax. I used it, it works perfectly.
<TextBlock FontFamily="/Fonts/Comic.ttf#Comic" TextWrapping="Wrap" Text="Hello" FontSize="25"/>
Make sure that the Build Action must be set to Content,
Right Click on font in folder and click property, then select Build Action as Content, otherwise it will not work on Emulator and Device.

Try using this
<TextBlock x:Name="MainTextBlock" FontFamily=".\Fonts\KOMIKAX_.ttf#Komika Axis" TextWrapping="Wrap" Text="Hello" Width="680" Height="120" Margin="10,0,0,0" FontSize="25" Padding="20,10"/>
In case this doesn't work, remember the format is .\FontPath\FontFileName.ttf#FontName

Related

Cannot create an instance of UserControl in design view, works in Release mode and at runtime

I have a user control LoadingIndicatorControl which is displayed in various other controls when loading is happened.
This user control is very simple and looks like this:
<StackPanel HorizontalAlignment="Stretch"
Visibility="{Binding Loading, Converter={StaticResource Bool2Vis}}">
<Image x:Name="imgLoadingSpinner"
gif:ImageBehavior.AnimatedSource="pack://application:,,,/Images/Loading_Spinner.gif"
HorizontalAlignment="Right"
Width="30"
Height="30" />
</StackPanel>
I nest it in other views like this:
<uc:LoadingIndicatorControl Loading="{Binding Loading}"
DockPanel.Dock="Bottom"/>
When I run this application it compiles without issues and the loading indicator is displayed as I expect.
However at design time only I'm getting errors about this user control, related to the image resource. This gif is set to Build Action Resource.
In my host view I get this:
And if I look at the detail of why, it says Cannot locate resource 'images/loading_spinner.gif':
If I look at LoadingIndicatorControl in design view it does in fact locate the loading_spinner.gif resource and gives no errors.
What I have tried:
Clean and rebuild numerous times
Close VS2019 and reopen
Clean, close VS, reopen and rebuild
Set Loading_Spinner.gif Build Action to Embedded Resource (was Resource which also works at runtime)
Tried platform targets Any CPU, x64, x86
Interestingly, setting to build configuration to Release does prevent the error from appearing! It only appears when Debug is used.
I'm using Visual Studio Professional v16.11.16.
Any ideas how I can fix this?
Just use the direct path to the image:
<Image gif:ImageBehavior.AnimatedSource="Images/Loading_Spinner.gif"
HorizontalAlignment="Center"
VerticalAlignment="Center"
Width="30"
Height="30" />
If you really need the pack URI, the format is explained here, it look like this:
<Image gif:ImageBehavior.AnimatedSource="pack://application:,,,/SO_72648958;component/Images/Loading_Spinner.gif"
HorizontalAlignment="Center"
VerticalAlignment="Center"
Width="30"
Height="30" />
Working demo here.

WPF TTF-font not applying

I trying write app in WPF (C#) and I would like use ttf font for digital clock style.
I get font from internet, in archive i have 4 files. Add it to project into Font folder. Actions for file is Resource and Copy always. Then i add font-resource for my control in xaml:
<Control.Resources>
<FontFamily x:Key="DS-Digital">.\..\Fonts\#DS-Digital</FontFamily>
</Control.Resources>
And use it to TextBlock:
<TextBlock FontFamily="{StaticResource DS-Digital}"
Foreground="GreenYellow"
Text="{Binding GameTime, Converter={StaticResource SecondsCoverter}}"/>
It work. But it font not monospace. Then I downloaded another font. It monospace. In new archive i had only one file. Add it to project and use like previous font:
<Control.Resources>
<FontFamily x:Key="DS-Digital">.\..\Fonts\#DS-Digital</FontFamily>
<FontFamily x:Key="MonoDigital">.\..\Fonts\#Digital-7</FontFamily>
</Control.Resources>
and
<TextBlock FontFamily="{StaticResource MonoDigital}"
Foreground="GreenYellow"
Text="{Binding GameTime, Converter={StaticResource SecondsCoverter}}"/>
But it not applied. What i doing wrong?
Thank you for answer and sorry my english.

Save text box data to a local file in a Windows 8 app

I'm learning how to build Windows 8 apps in XAML and I'm somewhat new to it. I have three text boxes and a button on a page and I want to take the text in each text box and save it to a file locally.
<Grid Background="{StaticResource ApplicationPageBackgroundThemeBrush}">
<TextBox HorizontalAlignment="Left" Margin="321,160,0,0" TextWrapping="Wrap" Text="First Name" VerticalAlignment="Top"/>
<TextBox HorizontalAlignment="Left" Margin="321,211,0,0" TextWrapping="Wrap" Text="Last Name" VerticalAlignment="Top"/>
<TextBox HorizontalAlignment="Left" Margin="321,260,0,0" TextWrapping="Wrap" Text="Age" VerticalAlignment="Top"/>
<Button Content="Button" HorizontalAlignment="Left" Margin="321,324,0,0" VerticalAlignment="Top"/>
</Grid>
It doesn't really matter what kind of file it is, I'm going to assume a .txt file is fairly easy to create. I've tried to wire up a FileStream on the button click, but intellisense wouldn't allow me to add the necessary usings for it. I'm starting to get the feeling that there is another way you're supposed to handle binary files in Windows 8 apps. If someone could guide me into the right documentation or quickly show me how to set it up, I'd appreciate it.
A fairly easy to use method is File.WriteAllLines as shown in this topic
All you have to do now is retrieve the value from the textboxes. Make sure you assign them a Name property, so you can target them in your code-behind:
<TextBox Name="ageTextBox" HorizontalAlignment="Left" Margin="321,260,0,0" TextWrapping="Wrap" Text="Age" VerticalAlignment="Top"/>
Then in your Code-Behind, say on the button click, add the Text to a list:
List<string> myList = new List<string>();
myList.Add(ageTextBox.Text);
Finally, you write the contents of your list to a specified file:
string path = "D:\\Temp\\MyFile.txt";
File.WriteAllLines(path, myList);
Do note you have to create the eventhandler yourself, name the other textboxes and add their texts to the list too.

Why do my images show at designtime and not at runtime?

I have a WPF <Image> that I am trying to display on a <Button> inside of a <Toolbar> with the following code.
<ToolBarTray>
<ToolBar Height="26" Name="toolBar1" VerticalAlignment="Top" >
<Button Name="StampButton" Click="StampButton_Click">
<Image Source="/MyApp.Resources;component/Resources/MyImage.png"
Height="16" Width="16" Stretch="Fill"/>
</Button>
</ToolBar>
</ToolBarTray>
The image shows up just fine at design time. However, at runtime nothing is displayed. The resources are in another dll called MyApp.Resources. The button is actually created just fine and the click event works fine also.
Set your image build action to "Resource". Try to use full source path.
I was getting same problem - image displaying at design time, but not at runtime.
I had build action set to resource, tried different pack uris etc etc, but solution was simple
<Window.Resources>
<BitmapImage x:Key="your_image_key" UriSource="your_image.png" />
<Image Source="{StaticResource your_image_key}"/>
</Window.Resources>
This is what worked for me, from a site called wpf-tutorial.com:
<Image Source="/WpfTutorialSamples;component/Images/copy.png" />
Images is a subfolder of the project folder in my case, and I assume also in this sample.

How to display a Button which hosts TextBlock with the style PhoneTextSubtleStyle?

I need to create a button with two lines of text:
The first one is Command Title like "Save"
The second one is a Description of the Command like "The application state will be saved"
So I have written the next xaml:
<Button Margin="0,128,0,0" Padding="10,5" HorizontalContentAlignment="Stretch" VerticalContentAlignment="Stretch">
<StackPanel Margin="0" UseLayoutRounding="False">
<TextBlock FontSize="{StaticResource PhoneFontSizeMediumLarge}" FontFamily="{StaticResource PhoneFontFamilySemiBold}">Save</TextBlock>
<TextBlock Style="{StaticResource PhoneTextSubtleStyle}" Margin="0">The application state will be saved</TextBlock>
</StackPanel>
</Button>
This code working well except a one issue. The Description line becomes invisible when the button is pushed.
I'm sure the root cause is the low contrast color of the description line. But I don't know how to fix it.
Update: I have tried to use the PhoneTextSubtleStyle style but still have the same issue.
You could retemplate the Button (using the Control.Template property) to look different so that when pushed it no longer interferes with the content.
Could you try something like this
System.Windows.Visibility.Visible;
System.Windows.Visibility.Hidden;
or
System.Windows.Visibility.Collapsed
here is a link that will show an example of how to use this inside of a StackPanel
How to: Change the Visibility Property

Categories

Resources