We Keep Coding

Buttons resize with page when i dont want them toWPF

Hello I added some buttons to my Main_Page.xaml and they resize with the window while running the application and i dont want that. I want them to stay the same proportion when i run the app.
Button names are: Exercise_tab_left_button, Exercise_tab_right_button
<Page x:Class="TrackFit_Project.Main_Page"
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:TrackFit_Project"
mc:Ignorable="d"
d:DesignHeight="453.635" d:DesignWidth="855.207"
Title="Main_Page"
ShowsNavigationUI = "false" >
<TabControl Margin="10,10,10.333,10.333">
<TabItem Header="Exercise"
HorizontalAlignment="Left"
Width="58"
Height="22"
Margin="-2,-2,0,0"
VerticalAlignment="Top">
<Grid Background="#FFE5E5E5">
<Button x:Name="Exercise_Tab_Profile_Button" HorizontalAlignment="Left" Height="100" VerticalAlignment="Top" Width="100" Click="profileButtonClick">
<Image>
<Image.Source>stock profile image.png</Image.Source>
</Image>
</Button>
<Rectangle x:Name="Exercise_tab_rectangle" Fill="#FFCFC6C6" HorizontalAlignment="Left" Height="295" Margin="137,50,0,0" Stroke="Black" VerticalAlignment="Top" Width="625"/>
<TextBlock HorizontalAlignment="Left" Height="234" Margin="169,87,0,0" TextWrapping="Wrap" Text="TextBlock" VerticalAlignment="Top" Width="548"/>
**<Button x:Name="Exercise_tab_left_button" Content="<" Margin="148,189,655,154" FontSize="18" FontWeight="Bold"/>
<Button x:Name="Exercise_tab_Right_button" Content=">" Margin="717,189,83,155" FontSize="18" FontWeight="Bold"/>**
<TextBlock x:Name="Log_Out_Text_Block" HorizontalAlignment="Left" Margin="10,105,0,0" TextWrapping="Wrap" VerticalAlignment="Top" FontWeight="Bold">
<Hyperlink x:Name="Log_out_hyperlink" Click="Log_out_hyperlink_Click">Log out</Hyperlink>
</TextBlock>
</Grid>
</TabControl>

You have to specify the properties Height and Width instead of setting these values indirectly using the Margin property.
Currently the Margin property determines the width and height of the buttons when they are arranged in the Grid. This can be useful when the UI is static and must not resize when the window is resized.
Assuming you want the UI to dynamically adapt to the size you should embed the Rectangle, TextBlock and the Buttons in a second Grid in a way like this (you might want to figure out the right values for the Margin and size of the buttons):
<Grid Margin="137,50,10,10">
<Rectangle x:Name="Exercise_tab_rectangle" Fill="#FFCFC6C6" Stroke="Black" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" />
<TextBlock HorizontalAlignment="Stretch" Height="234" Margin="32,37" TextWrapping="Wrap" Text="TextBlock" VerticalAlignment="Stretch" />
<Button x:Name="Exercise_tab_left_button" Content="<" Margin="11" VerticalAlignment="Center" HorizontalAlignment="Left" Width="20" Height="50" FontSize="18" FontWeight="Bold"/>
<Button x:Name="Exercise_tab_Right_button" Content=">" Margin="11" VerticalAlignment="Center" HorizontalAlignment="Right" Width="20" Height="50" FontSize="18" FontWeight="Bold"/>
</Grid>

UWP App Template

I'm developing a UWP application. The design of the UI is similar to the Email app in Windows 10 (My app design).
This is my XAML code:
<Page
x:Class="Milano.InWork"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="using:Milano"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d">
<Grid BorderBrush="White" BorderThickness="1">
<Grid.Background>
<ImageBrush Stretch="Fill" ImageSource="Images/Background.png"/>
</Grid.Background>
<Grid HorizontalAlignment="Left" Height="720" VerticalAlignment="Top" Width="60" BorderBrush="#FFF5F1F1" BorderThickness="0,0,1,0">
<Button x:Name="MenuButton" Content="" HorizontalAlignment="Left" Margin="10,10,0,0" VerticalAlignment="Top" Height="38" Width="38">
<Button.Background>
<ImageBrush Stretch="Uniform" ImageSource="Images/Menu-100.png"/>
</Button.Background>
</Button>
<Button x:Name="logoutbutton" Content="" HorizontalAlignment="Left" Margin="10,650,0,0" VerticalAlignment="Top" Height="43" Width="38">
<Button.Background>
<ImageBrush Stretch="Uniform" ImageSource="Images/Logout_Button.png"/>
</Button.Background>
</Button>
</Grid>
<Grid HorizontalAlignment="Left" Height="47" Margin="63,2,-121,0" VerticalAlignment="Top" Width="1338" BorderBrush="#FFFDFDFD" Padding="0,0,0,1" BorderThickness="0,0,0,1">
<TextBlock x:Name="textBlock" HorizontalAlignment="Left" TextWrapping="Wrap" Text="В Работе" VerticalAlignment="Top" Height="47" Width="1218" FontSize="32" FontFamily="SF UI Display" Padding="550,0,0,0" Foreground="White"/>
</Grid>
<ScrollViewer HorizontalAlignment="Left" Height="668" Margin="63,52,0,0" VerticalAlignment="Top" Width="350">
<GridView x:Name="OrdersGridView" >
<GridView.ItemTemplate>
<DataTemplate>
<StackPanel >
<Grid Height="204" BorderBrush="#FFFBF8F8" BorderThickness="0,0,1,1">
<TextBlock Text="{Binding date_created}" HorizontalAlignment="Left" TextAlignment="Center" TextWrapping="Wrap" VerticalAlignment="Top" Width="350" Height="50" FontFamily="SF UI Display" FontSize="25" FontWeight="Light" Foreground="White" />
<TextBlock TextAlignment="Center" HorizontalAlignment="Left" Margin="0,146,-1,0" TextWrapping="Wrap" Text="{Binding billing.address_1}" VerticalAlignment="Top" Height="58" Width="350" FontFamily="SF UI Display" FontSize="25" FontWeight="Light" Foreground="White" />
<TextBlock HorizontalAlignment="Left" TextAlignment="Center" Margin="0,86,-1,0" TextWrapping="Wrap" Text="{Binding billing.first_name}" VerticalAlignment="Top" Height="60" Width="350" FontFamily="SF UI Display" FontSize="25" FontWeight="Light" Foreground="White" Padding="0,0,0,0"/>
</Grid>
</StackPanel>
</DataTemplate>
</GridView.ItemTemplate>
</GridView>
</ScrollViewer>
</Grid>
What I need to do: When user clicks on Grid in right place of screen app show something like Fragment (I know this is Android thing) with some fields and data, like in the Email Windows 10 app:
Before clicking
After clicking
How I can implement this?
Or where I can read tutorial or something like this?
Thank's for help!

It is a typical Master/Detail design in UWP, you can refer to the official Master/detail sample, when on wide-screen mode, it uses ContentPresenter to show the details, and when on narrow-screen mode, it navigates with parameter to the detail page. The official sample is so clear, you can have a check.
From your first image, I think you can use a ListView to replace your GridView, for both controls, you can use SelectionChanged or ItemClick event to show the details, if you want to use ItemClick event, please don't forget to enable the IsItemClickEnabled property.
There is a MasterDetails (Mail App) sample which uses Template 10 as project template, if you're interest in this sample, you can also have a check.

Textboxes don't work Windows Phone 8.1 App

I am not able to have a user input in a textbox when click it both in the Emulator and in windows phone device. I have deleted all the textboxes and replace them with new ones without any special preferences and still don't work. I have implemented the whole interface of my application and need help to solve this issue and start playing with the server connection. Also the rest of the controls all work properly. Please any ideas?
This is the corresponding interface of the code I am posting below.
This is my mainpage.xaml code: If you need anything else please let me know.
<controls:ViewPage
x:Class="Menu_and_Topbar_app__Windows_Phone_8._1_3.MainPage"
xmlns:controls="using:Menu_and_Topbar_app__Windows_Phone_8._1_3.Controls"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="using:Menu_and_Topbar_app__Windows_Phone_8._1_3"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d">
<Grid Background="#FF250D5C">
<ScrollViewer HorizontalAlignment="Center"
VerticalAlignment="Center"
Margin="5.857,6.897,8.265,12.783" RenderTransformOrigin="0.5,0.5" Height="620.32" UseLayoutRounding="False" Width="385.878" d:LayoutRounding="Auto">
<ScrollViewer.RenderTransform>
<CompositeTransform Rotation="0.309"/>
</ScrollViewer.RenderTransform>
<Pivot Name="MyPivot" IsEnabled="True" IsTapEnabled="True">
<Pivot.HeaderTemplate>
<DataTemplate>
<TextBlock Text="{Binding}" FontSize="37" SelectionHighlightColor="#FF898888" />
</DataTemplate>
</Pivot.HeaderTemplate>
<PivotItem x:Name="PivotItem1" Header="Sign In" IsEnabled="True" IsTapEnabled="True">
<Grid HorizontalAlignment="Left" Height="496" Margin="18,19,0,0" VerticalAlignment="Top" Width="311" IsTapEnabled="True" IsRightTapEnabled="True">
<Image x:Name="image" HorizontalAlignment="Left" Height="70" Margin="64,9,0,0" VerticalAlignment="Top" Width="193" Source="/Menu and Topbar app (Windows Phone 8.1)3/Pictures/logo.png" Visibility="Visible" />
<Button x:Name="button" Content="Log In" HorizontalAlignment="Left" Margin="98,409,0,0" VerticalAlignment="Top" Click="button_Click_1"/>
<TextBlock x:Name="textBlock" HorizontalAlignment="Left" Margin="16,113,0,0" TextWrapping="Wrap" Text="Username or Email:" VerticalAlignment="Top" FontSize="16"/>
<TextBlock x:Name="textBlock2" HorizontalAlignment="Left" Margin="16,210,0,0" TextWrapping="Wrap" Text="Password:" VerticalAlignment="Top" FontSize="16"/>
<HyperlinkButton Content="Sign Up for SCP?" HorizontalAlignment="Left" Margin="17,266,0,0" VerticalAlignment="Top" FontSize="13.333" NavigateUri="http://scponline.azurewebsites.net/Home/LoginPartialView"/>
<CheckBox x:Name="checkBox" Content="Remember me?" HorizontalAlignment="Left" Margin="17,312,0,0" VerticalAlignment="Top"/>
<TextBox x:Name="textBox" HorizontalAlignment="Left" Margin="17,137,0,0" TextWrapping="Wrap" Text="TextBox" VerticalAlignment="Top" Width="275" GotFocus="textBox_GotFocus" AllowDrop="True" />
</Grid>
</PivotItem>
<PivotItem x:Name="PivotItem2" Header="Sign Up" >
<Grid HorizontalAlignment="Left" Height="496" Margin="18,19,0,0" VerticalAlignment="Top" Width="311">
<Button Content="Sign Up" HorizontalAlignment="Left" Margin="97,437,0,0" VerticalAlignment="Top" Click="Button_Click_2"/>
<TextBlock x:Name="textBlock3" HorizontalAlignment="Left" Margin="16,108,0,0" TextWrapping="Wrap" Text="Email:" VerticalAlignment="Top" FontSize="16"/>
<TextBlock x:Name="textBlock4" HorizontalAlignment="Left" Margin="16,168,0,0" TextWrapping="Wrap" Text="Password:" VerticalAlignment="Top" FontSize="16"/>
<TextBox x:Name="textBox3" HorizontalAlignment="Left" Margin="16,126,0,0" TextWrapping="Wrap" Text="username#mail.com" VerticalAlignment="Top" Height="0" Width="276" FontSize="17.593" RenderTransformOrigin="0.5,0.5">
<TextBox.RenderTransform>
<CompositeTransform ScaleY="0.9"/>
</TextBox.RenderTransform>
</TextBox>
<TextBox x:Name="textBox4" HorizontalAlignment="Left" Margin="16,187,0,0" TextWrapping="Wrap" Text="***********" VerticalAlignment="Top" Height="0" Width="276" TextChanged="textBox2_TextChanged" FontSize="17.593" RenderTransformOrigin="0.5,0.5">
<TextBox.RenderTransform>
<CompositeTransform ScaleY="0.9"/>
</TextBox.RenderTransform>
</TextBox>
<Image x:Name="image1" HorizontalAlignment="Left" Height="70" Margin="64,9,0,0" VerticalAlignment="Top" Width="193" Source="/Menu and Topbar app (Windows Phone 8.1)3/Pictures/logo.png"/>
<TextBlock x:Name="textBlock1" HorizontalAlignment="Left" Margin="16,232,0,0" TextWrapping="Wrap" Text="Name:" VerticalAlignment="Top" SelectionChanged="textBlock1_SelectionChanged" FontSize="16"/>
<TextBox x:Name="textBox5" HorizontalAlignment="Left" Margin="16,250,0,0" TextWrapping="Wrap" Text="" VerticalAlignment="Top" Height="0" Width="276" TextChanged="textBox2_TextChanged" FontSize="17.593" RenderTransformOrigin="0.5,0.5">
<TextBox.RenderTransform>
<CompositeTransform ScaleY="0.9"/>
</TextBox.RenderTransform>
</TextBox>
<TextBlock x:Name="textBlock5" HorizontalAlignment="Left" Margin="16,292,0,0" TextWrapping="Wrap" Text="Name:" VerticalAlignment="Top" SelectionChanged="textBlock1_SelectionChanged" FontSize="16"/>
<TextBox x:Name="textBox6" HorizontalAlignment="Left" Margin="16,310,0,0" TextWrapping="Wrap" Text="" VerticalAlignment="Top" Height="0" Width="276" TextChanged="textBox2_TextChanged" FontSize="17.593" RenderTransformOrigin="0.5,0.5">
<TextBox.RenderTransform>
<CompositeTransform ScaleY="0.9"/>
</TextBox.RenderTransform>
</TextBox>
</Grid>
</PivotItem>
</Pivot>
</ScrollViewer>
</Grid>

XAML for Windows Phone 7

I am building an app in Windows Phone 7.
I am showing a few data in different TextBlocks.
But as the data size is too big, it doesn't fit in my view.
I want to show the data like a paragraph.
If the data size exceeds the size of the emulator I want to put a ScrollBar so that the data can be scrolled and viewed.
Please help me.
I am providing my XAML design.
<Grid x:Name="ContentPanel" Margin="12,17,12,0" Grid.RowSpan="2">
<TextBlock TextAlignment="Center" Height="63" HorizontalAlignment="Right" Margin="0,6,43,0" Name="textBlock1" Text="News Details" VerticalAlignment="Top" Width="308" FontFamily="Verdana" FontSize="48" Foreground="AntiqueWhite"/>
<TextBlock Height="46" HorizontalAlignment="Left" Margin="45,333,0,0" Name="date" Text="" VerticalAlignment="Top" Width="173" FontFamily="Verdana" FontSize="24" />
<TextBlock Height="43" HorizontalAlignment="Left" Margin="45,397,0,0" Name="title" Text="" VerticalAlignment="Top" Width="373" />
<TextBlock Height="206" HorizontalAlignment="Left" Margin="45,462,0,0" Name="description" Text="" VerticalAlignment="Top" Width="373" />
<Image Height="167" HorizontalAlignment="Left" Margin="45,113,0,0" Name="newsimage" Stretch="Fill" VerticalAlignment="Top" Width="368" />
</Grid>
<Button x:Name="previous" BorderThickness="0" Click="Image_Back" Margin="0,23,431,682" HorizontalAlignment="Right" Width="76" Height="63" Grid.RowSpan="2">
<Button.Background>
<ImageBrush Stretch="Fill" ImageSource="Image/Previous.png" />
</Button.Background>
</Button>
</Grid>

Try this,
<Grid x:Name="ContentPanel" Margin="12,17,12,0" Grid.RowSpan="2">
<ScrollViewer HorizontalScrollBarVisibility="Auto">
<Grid VerticalAlignment="Top" HorizontalAlignment="Left">
<TextBlock TextWrapping="Wrap" TextAlignment="Center" Height="63" HorizontalAlignment="Right" Margin="0,6,43,0" Name="textBlock1" Text="News Details" VerticalAlignment="Top" Width="308" FontFamily="Verdana" FontSize="48" Foreground="AntiqueWhite"/>
<TextBlock TextWrapping="Wrap" Height="46" HorizontalAlignment="Left" Margin="45,333,0,0" Name="date" Text="" VerticalAlignment="Top" Width="173" FontFamily="Verdana" FontSize="24" />
<TextBlock TextWrapping="Wrap" Height="43" HorizontalAlignment="Left" Margin="45,397,0,0" Name="title" Text="" VerticalAlignment="Top" Width="373" />
<TextBlock TextWrapping="Wrap" Height="206" HorizontalAlignment="Left" Margin="45,462,0,0" Name="description" Text="" VerticalAlignment="Top" Width="373" />
<Image Height="167" HorizontalAlignment="Left" Margin="45,113,0,0" Name="newsimage" Stretch="Fill" VerticalAlignment="Top" Width="368" />
</Grid>
</ScrollViewer>
</Grid>
More details
http://msdn.microsoft.com/en-us/library/system.windows.controls.scrollviewer(v=vs.110).aspx
http://dotnet.dzone.com/news/scrollviewer-not-scrollable

Try using Scrollable textblock. Hope that help you to solve the issue.

Switching between landscape and portrait mode using wpf in tablet devices

How could we arrange the controls on a WPF window so that it would automatically align the controls while switching between view modes occur ie between landscape and portrait mode.
<Window x:Class="Custom_Track_Reports.LoginWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="LoginWindow" >
<Viewbox Stretch="Fill">
<Grid Background="#FF58B0DF" Height="401">
<Rectangle Fill="#FFF0F3F4" Height="173" Margin="45,197,58,0" Stroke="Black" VerticalAlignment="Top" AllowDrop="True" />
<Image Height="125" Margin="340,10,330,0" VerticalAlignment="Top" Source="Images/logo_lrg.png"/>
<Label Content="Custom Track Reports" HorizontalAlignment="Left" Margin="287,147,0,0" VerticalAlignment="Top" RenderTransformOrigin="0.607,1.112" Width="268" Height="47" FontFamily="Arial" FontSize="26" Foreground="White"/>
<TextBox Margin="128,0,0,110" TextWrapping="Wrap" VerticalAlignment="Bottom" Height="25" BorderThickness="1" FontFamily="Arial" FontSize="21" Text="" Name="userTextBox" FontStretch="Expanded" Opacity="1" HorizontalAlignment="Left" Width="546" AcceptsReturn="False" KeyDown="userTextBox_KeyDown" />
<Button x:Name="enterButton" Content="Enter" HorizontalAlignment="Right" Margin="0,311,166,0" VerticalAlignment="Top" Width="110" Height="26" FontSize="14" Style="{DynamicResource button}" Click="enterButton_Click"/>
<Label Content="User ID" FontSize="20" FontWeight="Bold" Height="40" HorizontalAlignment="Left" Margin="122,215,0,0" Name="label1" VerticalAlignment="Top" Width="105" />
</Grid>
</Viewbox>