Develop Reference

TextBox vertical alignment in Windows Store App

I'm trying to do something that seems quite simple but that I haven't been able to do so far : Vertically align the text in a TextBox in Windows Store App (XAML).
VerticalContentAlignment doesn't work (although it works well in WPF). I've even tried to extract the template and change it. Still couldn't do it.
Does anyone know how to do it ?

Unfortunately there is no simple way. However if your TextBox has a fixed size then you can adjust the Padding Property in a custom style, it can be done dynamically too, but it is a bit more work.
<Style TargetType="TextBox" x:Key="CustomTextBoxStyle">
<Setter Property="Padding"
Value="25" />
</Style>
<TextBox Text="TestText"
Height="80"
Style="{StaticResource CustomTextBoxStyle}" />

Also you can try this one also...
<Grid>
<TextBox Text="Centered Text" TextAlignment="Center" VerticalAlignment="Center"/></Grid>

How to add a svg/xaml file in C# WPF windows just like image?

How to add a .svg file in a WPF window in C# as an image (,png || ,jpg)?
I use the code
<Image HorizontalAlignment="Left" Height="53" Margin="34,39,0,0"
VerticalAlignment="Top" Width="71"
Source="Test.svg" Name="MyImage"/>
But I get an error:
Blend does not support format svg.
I found that I could change the .svg file into a .xaml file. But I still do not know how to add the xaml as an image.
Based on an answer, I changed my code like this:
<Window x:Class="NIA_UI_Demo_CSharp.ShareDocumentsWin"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:svgc="http://sharpvectors.codeplex.com/svgc/"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="ShareDocumentsWin" Height="350" Width="569">
<ResourceDictionary>
<Style x:Key="TheAwesomeXAMLimage" TargetType="ContentControl">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="ContentControl">
my code
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
</ResourceDictionary>
<Grid Margin="0,0,2,3">
<ContentControl Style="{StaticResource TheAwesomeXAMLimage}"/>
</Grid>
</Window>
But I get an error:
Content is set more than once;

As far as I know you cannot include svg-files directly.
Two options:
use library that can handle svg-files in runtime: https://sharpvectors.codeplex.com/ (moved to https://github.com/ElinamLLC/SharpVectors)
convert the svg to xaml and use them with native wpf objects (Path, Image..)
I prefer the second option, so I wrote a tool which can convert a single svg to xaml and can also batch convert a bunch of svg-files. The workflow is: just put the svg-file to your images-folder, call the batch-converter and find the images.xaml file (a resource-dictionary) updated with the new icons/images.
See https://github.com/BerndK/SvgToXaml

I was lucky that I have DevExpress available where you can use WpfSvgRenderer.CreateImageSource. Don't want to advertise here, but since it's a widely used library, probably some are happy to know.
Unfortunately text element inside the svg is not supported yet.

Can't drag items from a ListView in my Windows Phone 8.1 app

I am creating my very first Windows Phone 8.1 app as part of a Windows Store Universal app. The Desktop/tablet version is done and has been in the store for a few weeks, and it works great. I'm being careful and assuming as little as possible as I build out the Phone version, and I have had reasonable success so far. However, there is one problem that I just haven't been able to sort out through experimentation, Stackoverflow or Google: I can't get items in a ListView to be draggable.
Here's a shot of one of the pages from my app:
The user creates a workout routine by dragging exercises from the ListView on the right-hand side to the area on the left-hand side. They can drag an exercise as many times as they want; that's why it's not just a single list on which items can be checked.
This works perfectly on the desktop/tablet version, but on the phone version, when I click and hold an item, I can't drag it anywhere. It won't move, and it doesn't show any affordance to indicate that it is draggable.
Here is the XAML that I use to define the ListView. It is nearly identical to the working version, but I have turned on some properties that aren't present there (IsSwipeEnabled I think), hoping that they would make the magic work:
<ListView x:Name="StepsList" ItemsSource="{Binding Steps}"
ContainerContentChanging="ItemView_ContainerContentChanging"
SelectionMode="Single" Drop="StepsList_Drop"
Tapped="StepsList_Tapped"
CanDragItems="True"
AllowDrop="True"
ScrollViewer.VerticalScrollBarVisibility="Auto"
Grid.Row="1" Grid.Column="1"
DragItemsStarting="StepsList_DragItemsStarting"
Margin="5,0"
IsSwipeEnabled="True"
SelectionChanged="StepsList_SelectionChanged">
<ListView.ItemContainerStyle>
<Style TargetType="ListViewItem">
<Setter Property="HorizontalContentAlignment" Value="Center" />
<Setter Property="MinWidth" Value="300" />
<Setter Property="MaxWidth" Value="300" />
<Setter Property="AllowDrop" Value="True" />
</Style>
</ListView.ItemContainerStyle>
<ListView.ItemTemplate>
<DataTemplate>
<local:StepControl Role="StepsSource" Tapped="StepSourceItem_Tapped" />
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
I put a break point inside the DragItemsStarting event handler code, and it is never hit.

You need to set it in the code behind.
StepsList.ReorderMode = ListViewReorderMode.Enabled;

The MSDN documentation for dragging shows that only the Windows 8.1 app will support it unfortunately.
Edit: Having delved deeper, it seems it should be supported through Universal app development across both platforms. Does the dragging functionality work in your Windows 8.1 app?

FindResource not working in Custom Control DLL

While I am still learning WPF I have yet run into another problem. I have a DLL which is of type Custom Control. I've implemented my base control and I have several controls which derive from this base; the base control is never used. The problem is whenever I call FindResource or TryFindResource it always fails. I have a separate dictionary that I merged in my Themes/Generic.xaml file:
Gernieric.xaml
<ResourceDictionary.MergedDictionaries>
<ResourceDictionary Source="/DllProject;component/Themes/NewResource.xaml" />
<!-- I've tried several other ways for the Source format, i.e. pack:... -->
</ResourceDictionary.MergedDictionaries>
Now I am trying to set the Style of my derived controls in the derived controls constructor without the control being on a visible canvas or panel at the time. I also want to export a VisualBrush of the control as a BitmapSource. All of the code was working when I put my NewResource.xaml in the EXE project (where it doesn't belong). I've read articles on adding a dummy tag to the resource dictionary as well as put all of my code in the Generic.xaml file. Like I said all of this works fin if move the xaml file to the main EXE. Its as if the DLL isn't even loading the xaml file or even aware there is anything declared in it until the control is on a visible window.
I have a style for my base control (NewResource.xaml):
<Style TargetType="{x:Type local:MyDerivedControl}">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type local:MyDerivedControl}">
<Grid>
<Path x:Name="MyPath" Style="{TemplateBinding DepProp}" />
<TextBlock x:Name="Text" HorizontalAlignment="Center" VerticalAlignment="Center" Text="{TemplateBinding Text}"/>
</Grid>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
After doing a lot of research on the internet it seems WPF dropped the ball on DLLs and resources.

I found the answer that worked. Basically change the x:Key to contain a ComponentResourceKey. A full description can be viewed here that is straight forward to understand.

Remove background animation with XAML C#?

I'm creating a header with the back button and logo. I figured out how to add a background using
<Grid Grid.ColumnSpan="2" Background="Black">
[...]
</Grid>
But now I end up with the background being part of the page animation transition. What I want is exactly like the header background in Microsoft's Contoso News demonstration application on their "Animating your UI" page. That first video shows all the content in the app being animated with the header being static.
I've tried multiple searches and putting together code I've thought would work, including messing with <EntranceThemeTransition FromHorizontalOffset="0" FromVerticalOffset="0"/>. Unless I'm missing something, I can't find documentation on removing an animation.
A step in the right direction would be greatly appreciated. Thanks.

I guess I didn't read Microsoft's documentation thoroughly-enough during a 3am session.
What I needed to do was add a custom EntranceThemeTransition to the parent:
<Style x:Key="LayoutRootStyle" TargetType="Panel">
<Setter Property="Background" Value="{StaticResource ApplicationPageBackgroundThemeBrush}"/>
<Setter Property="ChildrenTransitions">
<Setter.Value>
<TransitionCollection>
<EntranceThemeTransition FromHorizontalOffset="0" IsStaggeringEnabled="false"/>
</TransitionCollection>
</Setter.Value>
</Setter>
</Style>
The FromHorizontalOffset="0" tells it to move zero pixels horizontally (in other words, not to animate at all), and IsStaggeringEnabled="false" tells it to render all the items at once. From here, I can add a custom animation to each of the children.
MSDN Resources:
IsStaggeringEnabled property
FromHorizontalOffset property