VB.net WPF textblock - wpf

can you please help me.
Im new in WPF and trying absolutely simple code. Have form with open save dialog. Path to a file im fill to a textblock and this string i need use in other module.
Without WPF i know how i can use it
frm_main.txt_path.text
But i cannot find this in WPF. This is my form. And i need use txt_path textblock
<Window x:Class="MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:local="clr-namespace:SCM_TO_BIESSE"
mc:Ignorable="d"
Title="Conversion SCM XXL code to Biesse XNC" Height="413.059" Width="647.202">
<Grid x:Name="frm_main" Margin="1,1,1,1.2">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="0*"/>
<ColumnDefinition Width="194*"/>
<ColumnDefinition Width="445*"/>
</Grid.ColumnDefinitions>
<Grid.Background>
<LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
<GradientStop Color="Black" Offset="0"/>
<GradientStop Color="#FF4396E4" Offset="1"/>
</LinearGradientBrush>
</Grid.Background>
<TextBlock x:Name="txt_path" HorizontalAlignment="Left" Margin="68,196,0,0" TextWrapping="Wrap" VerticalAlignment="Top" Height="48" Width="285" Grid.ColumnSpan="3" Foreground="#FF6B5050">
<TextBlock.Background>
<LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
<GradientStop Color="#FF897F7F" Offset="0"/>
<GradientStop Color="#FFFAFAFA" Offset="1"/>
</LinearGradientBrush>
</TextBlock.Background>
</TextBlock>
<Button x:Name="btn_open" Content="Select file for conversion" HorizontalAlignment="Left" Margin="211.4,196,0,0" VerticalAlignment="Top" Width="160" Height="48" Grid.Column="2" RenderTransformOrigin="0.377,-0.663"/>
<Image Grid.Column="1" Margin="1,1,317.4,295" Source="new.jpg" Stretch="Fill" Grid.ColumnSpan="2"/>
<Button x:Name="btn_open_Copy" Content="Start Conversion" HorizontalAlignment="Left" Margin="65.4,304,0,29" Width="160" Grid.Column="2" RenderTransformOrigin="0.377,-0.663"/>
</Grid>
</Window>
Thanks very much for a help .
Marek

WPF is predicated (based, built) on binding to achieve a separation of concerns. You can do things the same way as WinForms but it isn't advised.
First (as mentioned in a comment) you need to use a TextBox, not a TextBlock. You haven't bound your TextBox to an underlying property (note that I've simplified this):
<TextBox x:Name="txt_path"
Text="{Binding YourTextProperty}"
Height="48" Width="285"
>
</TextBox>
</Grid>
You then have a public get/set string property called YourTextProperty on your viewmodel - then anything populated in to that TextBox will get automatically propagated to the underlying property (and vice versa - if you've correctly implemented INPC then any value populated into the property will get reflected in the textbox).

Related

A shape in XAML - how to draw this:

I need to make this shape on a windows phone 8 using XAML:
It is easy to make a rectangle with rounded corners, and the gray background also. But to make the top of the rectangle to be as shown seems very hard. Can someone give me a hint? It's been 2 years since I used XAML, and I am removeing the rust.
nah not really, it's actually pretty simple and there's multiple ways to accomplish the same effect. Here's an example.
<Grid Width="150" Height="200">
<Grid.RowDefinitions>
<RowDefinition Height="20"/>
<RowDefinition/>
</Grid.RowDefinitions>
<Border CornerRadius="10,10,0,0">
<Border.Background>
<LinearGradientBrush EndPoint="0.822,0.633" StartPoint="0.158,0.189">
<GradientStop Color="#FF09CCF4" Offset="0"/>
<GradientStop Color="#FF020CA7" Offset="1"/>
</LinearGradientBrush>
</Border.Background>
<TextBlock Text="Blah" HorizontalAlignment="Center" VerticalAlignment="Center" Foreground="White"/>
</Border>
<Border Grid.Row="1" Background="White" CornerRadius="0,0,10,10"/>
<TextBlock Grid.Row="1" Text="Other Stuff" VerticalAlignment="Center" HorizontalAlignment="Center"/>
</Grid>
You can trade the Border 's that were used for Rectangle's if you like, hope this helps.

Silverlight Rounding Corners

I have a Grid with various child elements like Grid, Stackpanel, Image...Is it possible to round the corners of the grid in a way that crops ALL of the contents? Additionally, the root Grid can vary in size so that cannot be hard coded.
Edit: After a great deal of searching I found that the best solution for this problem is using ClippingBehavior as susggested by #wdavo, thanks! The real problem is not knowing the dimensions of the image. If you know the dimensions then there are many simple out of the box solutions out there.
You can use this clipping behavior
http://expressionblend.codeplex.com/SourceControl/changeset/view/61176#494852
You'll need the Expression Blend SDK installed
<UserControl
x:Class="RoundedCorners.MainPage"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:behaviors="clr-namespace:Expression.Samples.Interactivity"
xmlns:i="clr-namespace:System.Windows.Interactivity;assembly=System.Windows.Interactivity"
mc:Ignorable="d"
d:DesignHeight="800"
d:DesignWidth="800">
<Grid
x:Name="LayoutRoot"
Background="White"
Margin="50">
<Grid
Background="LightGreen">
<Grid.RowDefinitions>
<RowDefinition />
<RowDefinition
Height="Auto" />
</Grid.RowDefinitions>
<i:Interaction.Behaviors>
<behaviors:ClippingBehavior
CornerRadius="30" />
</i:Interaction.Behaviors>
<Image
Grid.Row="0"
Stretch="Fill"
Source="Image.JPG" />
<StackPanel
Grid.Row="1">
<TextBlock
Text="Hello" />
<TextBlock
Text="World" />
</StackPanel>
</Grid>
</Grid>
You can do that by inserting the grid or stack panel to a border control just like the code below:
<Border CornerRadius="5,5,0,5" BorderThickness="2" BorderBrush="Black" HorizontalAlignment="Center" Width="100" Height="100" VerticalAlignment="Center">
<StackPanel>
<StackPanel.Background>
<LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
<GradientStop Color="Black" Offset="0"/>
<GradientStop Color="#FF030FC6" Offset="0.2"/>
</LinearGradientBrush>
</StackPanel.Background>
</StackPanel>
</Border>
<Border CornerRadius="5,5,0,5" BorderThickness="2" BorderBrush="Black" HorizontalAlignment="Left" Width="100" Height="100" VerticalAlignment="Center" Margin="68.833,0,0,0">
<Border.Background>
<LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
<GradientStop Color="Black" Offset="0"/>
<GradientStop Color="#FFE90D0D" Offset="1"/>
</LinearGradientBrush>
</Border.Background>
<Grid/>
</Border>

WPF & XAML problem

Im new in WPF & Xaml
I dont know how to anchor how to dock...
On this screen gray is statusBar is docked but grid and menu is not all components are in canvas.
This is XAML
<Window
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
x:Class="WpfApplication6.MainWindow"
x:Name="Window"
Title="MainWindow"
Width="640" Height="480">
<Grid x:Name="LayoutRoot">
<Canvas>
<StackPanel Height="40" Width="624" VerticalAlignment="Top" HorizontalAlignment="Center">
<Menu Height="39" Margin="1,0,0,0">
<Menu.Background>
<LinearGradientBrush EndPoint="0,1" StartPoint="0,0">
<GradientStop Color="#FFF6F6F6" Offset="0.25"/>
<GradientStop Color="#FFEAE8E8" Offset="0.25"/>
<GradientStop Color="#FFDCD9D9" Offset="0.8"/>
<GradientStop Color="White" Offset="1"/>
</LinearGradientBrush>
</Menu.Background>
</Menu>
</StackPanel>
<StackPanel Height="356" Canvas.Top="44" Width="161" HorizontalAlignment="Left">
<Expander Header="Expander" Height="107">
<Grid Background="#FFE5E5E5"/>
</Expander>
</StackPanel>
<StackPanel Height="360" Canvas.Left="161" Canvas.Top="40" Width="463">
<DataGrid Height="361"/>
</StackPanel>
</Canvas>
<StackPanel Height="40" Margin="-1,0,0,0" VerticalAlignment="Bottom">
<StatusBar Height="40" Background="#FF897676"/>
</StackPanel>
</Grid>
You don't want these things to go in a Canvas. I'm not sure I've ever used a Canvas in WPF.
DockPanel is your friend, and this is how it works:
Each control in the DockPanel gets a DockPanel.Dock attached property : Left, Top, Right, or Bottom
What, no Fill? This is important: You can have one control fill up available space, and that will be the last control declared in the DockPanel. So, even if you want the "fill" control to be at the very top, you make it the last item in the DockPanel and set DockPanel.Dock="Top".
Other than the last, "fill" item, others which have the same dock setting will be docked in the order in which they were declared.
At its most basic, DockPanel can be used just like StackPanel except it will fill available space.

Canvas Background color not showing

I created a UserControl to display a popup using a TextBlock within a Canvas. Everything seems to be working OK, except for the background color of the canvas. It is being rendered as transparent no matter what I try. I also tried adding a Rectangle and filling it but that isn't working either. Here's the code:
<UserControl xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:Custom="clr-namespace:System.Windows.Interactivity;assembly=System.Windows.Interactivity"
xmlns:ic="clr-namespace:Microsoft.Expression.Interactivity.Core;assembly=Microsoft.Expression.Interactions"
xmlns:System="clr-namespace:System;assembly=mscorlib"
mc:Ignorable="d"
x:Class="PopupText.CanvasPopup"
d:DesignWidth="456"
d:DesignHeight="129">
<StackPanel x:Name="LayoutRoot"
Orientation="Horizontal">
<!--This button toggles the visibility of the popup-->
<Button x:Name="ActivateButton"
HorizontalAlignment="Left"
VerticalAlignment="Top"
BorderThickness="0"
Click="OnActivateButtonClicked">
<Image Source="/pushpin.png"
Width="36"
Height="36"
HorizontalAlignment="Center"
VerticalAlignment="Center"
Stretch="Fill"
Margin="0" />
</Button>
<Canvas x:Name="PopupContainer"
HorizontalAlignment="Left"
VerticalAlignment="Top"
Width="{Binding Width, ElementName=PopupText}"
Height="{Binding Height, ElementName=PopupText}"
Visibility="Collapsed">
<Canvas.Background>
<LinearGradientBrush EndPoint="0.5,1"
StartPoint="0.5,0">
<GradientStop Color="Black"
Offset="0" />
<GradientStop Color="#7FA79797"
Offset="1" />
</LinearGradientBrush>
</Canvas.Background>
<Rectangle Canvas.Left="0"
Canvas.Top="0"
RadiusX="20"
RadiusY="20"
Width="{Binding Width, ElementName=PopupText}"
Height="{Binding Height, ElementName=PopupText}">
<Rectangle.Fill>
<LinearGradientBrush EndPoint="0.5,1"
StartPoint="0.5,0">
<GradientStop Color="Black"
Offset="0" />
<GradientStop Color="#7F67749D"
Offset="1" />
</LinearGradientBrush>
</Rectangle.Fill>
<Rectangle.Stroke>
<LinearGradientBrush EndPoint="0.5,1"
StartPoint="0.5,0">
<GradientStop Color="Black"
Offset="0" />
<GradientStop Color="#7FC89B9B"
Offset="1" />
</LinearGradientBrush>
</Rectangle.Stroke>
</Rectangle>
<TextBlock x:Name="PopupText"
Text="A really long line of text that will either overflow or wrap"
TextWrapping="Wrap"
Width="350"
Canvas.Left="0"
Canvas.Top="0" />
</Canvas>
</StackPanel>
</UserControl>
Thanks for your help!
It looks like you want to bind the size of the Canvas to the actual size of the TextBlock not the values specified at design-time.
In that case, use a binding like this:
Width="{Binding ActualWidth, ElementName=PopupText}"
Height="{Binding ActualHeight, ElementName=PopupText}">
Your gradients appear to work if you set height manually. It would appear your height element binding isn't working as you expect it too.
I tested your Canvas in isolation with height 300, Rectangle height 200 and it didn't make much difference aesthetically what the height of the textblock was. Both the gradients worked fine, for the canvas and the rectangle.
You are binding the height property of the canvas and the rectangle to that of the textblock, but the textblock has an "auto" height property. XAML can't assign a height value to those elements for that reason. Try setting the height of the textblock manually rather than automatically. This will affect the other two elements right away.
P.S. If you remove Width="350" from the textblock, then the canvas and the rectangle will have 0 height and width on the stack panel. You need to set the height and width properties of the textblock manually since the other two elements depend on it.

Popup orientation is not correct. Its 90 degrees rotated

Hi
I have created a popup using Popup class in silverlight. I wrote a class of type UserControl and I added this usercontrol to the popup by using Child method of Popup class.
Following is the XAML code of my UserControl class
<UserControl x:Class="MyProject.PopupWindowContent"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
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}" UseLayoutRounding="False" Cursor="Hand">
<Grid Height="355" Name="grid1" Width="527.5">
<Image Height="355" HorizontalAlignment="Left" Name="image1" Stretch="Fill" VerticalAlignment="Top" Width="527" Source="/MyProject;component/dialog_bg.png" UseLayoutRounding="True" />
<Image Height="194" HorizontalAlignment="Left" Margin="13,87,0,0" Name="image2" Stretch="Fill" VerticalAlignment="Top" Width="502.5" Source="/MyProject;component/dialog_box_1.png" />
<Image Height="46" HorizontalAlignment="Left" Margin="25.25,35.25,0,0" Name="image3" Stretch="Fill" VerticalAlignment="Top" Width="49.75" Source="/MyProject;component/dialog_logo.png" />
<TextBlock Height="40" HorizontalAlignment="Left" Margin="153.25,38.75,0,0" Name="popupHeading" Text="TextBlock" VerticalAlignment="Top" Width="212" TextAlignment="Center" FontWeight="Bold" FontSize="26" />
<Button Content="Submit" Height="71" HorizontalAlignment="Left" Margin="130.75,265.75,0,0" Name="buttonOne" VerticalAlignment="Top" Width="132.25" BorderThickness="1" FontSize="18" Foreground="Black">
<Button.Background>
<LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
<GradientStop Color="White" Offset="0" />
<GradientStop Color="#FF06EF06" Offset="1" />
</LinearGradientBrush>
</Button.Background>
</Button>
<Button BorderThickness="1" Content="Cancel" FontSize="18" Foreground="Black" Height="71" HorizontalAlignment="Right" Margin="0,265.75,142,0" Name="buttonTwo" VerticalAlignment="Top" Width="132.25">
<Button.Background>
<LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
<GradientStop Color="White" Offset="0" />
<GradientStop Color="#FFEF0606" Offset="1" />
</LinearGradientBrush>
</Button.Background>
</Button>
<TextBox Height="162.75" HorizontalAlignment="Left" Margin="18,108.25,0,0" Name="popupBody" Text="TextBox" VerticalAlignment="Top" Width="480.5" Background="{x:Null}" FontSize="20" Foreground="White" BorderThickness="0" />
</Grid>
I set this PopupWindowContent to my popup using following code in my xaml file
Popup popUnWin = new Popup();
popUnWin.Child = new PopupWindowContent();
popUnWin.IsOpen = true;
Problem is that when I execute this code, popup orientation is according to portrait but my app is landscape. So popup looks 90 degrees rotated.
Can anyone please tell me how can i fix it?
Best Regards
I found that if you put the popup into the xaml code of the page, then the orientation is done properly.
Are you setting SupportedOrientation on every page of your app or just the first? I think there's a wierd thing that if you set it on your first page, some things will respect it, but others (like the popup) look at the supported orientations of the active page?
I've seen some suggestions of adding the popup to the visual tree. I tried adding it to my xaml and it still didn't rotate, but you might want to give it a shot.
Do not rotate the popup but place a border inside the popup and load the content in the border.
I got it to work like this:
//In .xaml
<Popup x:Name="myPopup">
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="480" />
</Grid.RowDefinitions>
<Border x:Name="popupBorder"/>
</Grid>
</Popup>
//In .xaml.cs
popupBorder.Child = new MyPopupPage(); //MyPopupPage is the "Windows Phone Landscape Page"
myPopup.IsOpen = true;

Resources