Beta 11.10 of C#/XAML for HTML5 released (DockPanel and GridSplitter!)

JS-Support @Userware
Site Admin
Posts: 1142
Joined: Tue Apr 08, 2014 3:42 pm

Beta 11.10 of C#/XAML for HTML5 released (DockPanel and GridSplitter!)

Postby JS-Support @Userware » Thu Jun 15, 2017 12:02 pm

Dear users,

We are pleased to inform you that the Beta 11.10 of C#/XAML for HTML5 - the extension for Visual Studio that lets you build cross-platform HTML5 apps in standard C# and XAML - is available for download!



DOWNLOAD:
CSharpXamlForHtml5_v1_0_public_beta11_10.zip
(22.92 MiB) Downloaded 556 times


Click to Learn More about C#/XAML for HTML5.




Here is what's new since Beta 11.9:

  • DockPanel
  • GridSplitter
  • The default accessor of "OnApplyTemplate" is now "protected" (for best compatibility with UWP code), and "public" in SL Migration projects
  • Fixed the OutOfMemoryException during compilation in case of large files (#630)
  • Fixed the error "Cannot read property '_items' of null" when resizing the Showcase app with beta 11.9
  • Fixed minor issues related to the Grid control



And here is what's new since Beta 11.8:

  • Grid.RowSpan and ColumnSpan!
    Note: in the Simulator and on older browsers (older browsers are browsers with a red color on this page), if a spanned element overlaps a non-spanned one, both elements are placed in the same cell. We will fix the Simulator in a future update.
  • The Grid control has been revamped: on modern browsers (modern browsers are browsers with a non-red color on this page) it now uses the CSS Grid Layout instead of html <table>. This leads to:
    - Better performance
    - Fewer DOM elements
    - Almost identical behavior as the MS XAML Grid!
  • 3X faster DataGrid control
  • Browser.Window.Navigate(uri) to navigate to a different HTML page
  • ListBox.SelectionMode.Extended
  • LinearGradientBrush.SpreadMethod.Repeat
  • Improved SL compatibility: use the "MouseRightButtonUp" event instead of "RightTapped"



You may also be interested to read:


Notes about installation:
  • Before installing this update, it is recommended that you close all the open instances of Visual Studio.
  • If for some reason you need to revert to the previous Beta, simply uninstall this one (from the Control Panel) and reinstall the previous Beta.


We hope you will enjoy this build! If you find any issues, please post them on the forums or send an email to support@cshtml5.com

Thank you.
Regards,
JS-Support

zemorango
Posts: 36
Joined: Tue Feb 02, 2016 6:30 am

Re: New Beta 11.10 released! [Download] (DockPanel and GridSplitter!)

Postby zemorango » Fri Jun 16, 2017 12:30 am

Nice work , You are almost there , just a few new components and localization suport and we are good to big migrations. Thank you very mush for your hard work. :D

zemorango
Posts: 36
Joined: Tue Feb 02, 2016 6:30 am

Re: New Beta 11.10 released! [Download] (DockPanel and GridSplitter!)

Postby zemorango » Mon Jun 19, 2017 3:40 am

Hi Js-Support, I've been trying the dockpanel but can't manage to make it work
My code look's like this:

Code: Select all

<Canvas>
        <TextBlock Text="Hello World!" x:Name="TextBlock1" Canvas.Left="20" Canvas.Top="30"/>
        <DockPanel Background="LightSkyBlue" Height="450"
                   LastChildFill="False">
            <Rectangle DockPanel.Dock="Bottom"               
              Fill="Green"               
              Height="100"               
              HorizontalAlignment="Stretch" />
            <Rectangle DockPanel.Dock="Top"               
              Fill="Blue"               
              Height="80"               
              HorizontalAlignment="Stretch" />
        </DockPanel>
    </Canvas>


do you have any example for the dockpanel and also for the gridsplitter?

JS-Support @Userware
Site Admin
Posts: 1142
Joined: Tue Apr 08, 2014 3:42 pm

Re: New Beta 11.10 released! [Download] (DockPanel and GridSplitter!)

Postby JS-Support @Userware » Mon Jun 19, 2017 4:01 am

zemorango wrote:My code look's like this:

You need to set the "Width" of the DockPanel because it is contained inside a Canvas. When a control is inside a Canvas, its default size is the size of its children, and since its children have a Width of 0, the Width of the DockPanel will also be 0. (Note: it works the same as in UWP, Silverlight, and WPF).


zemorango wrote:do you have any example for the dockpanel and also for the gridsplitter?

Sure. Here is a first example of the DockPanel control:
2017.06.19 - CSHTML5 DockPane1.png
2017.06.19 - CSHTML5 DockPane1.png (1.09 KiB) Viewed 11027 times

Code: Select all

<DockPanel Width="200" Height="180"  Background="#DDDDDD">
    <Border DockPanel.Dock="Left" Width="50" Background="Blue" CornerRadius="2" Margin="2"/>
    <Border DockPanel.Dock="Top" Height="50" Background="Red" CornerRadius="2" Margin="2"/>
    <Border DockPanel.Dock="Right" Width="50" Background="Green" CornerRadius="2" Margin="2"/>
    <Border DockPanel.Dock="Bottom" Height="50" Background="Orange" CornerRadius="2" Margin="2"/>
    <Border DockPanel.Dock="Left" Width="50" Background="Purple" CornerRadius="2" Margin="2"/>
    <Border Background="Pink" CornerRadius="2" Margin="2"/>
</DockPanel>



Here is a second example of the DockPanel control:
2017.06.19 - CSHTML5 DockPane2.png
2017.06.19 - CSHTML5 DockPane2.png (2.56 KiB) Viewed 11027 times

Code: Select all

<Border Width="300" Padding="10" Background="#DDDDDD" Margin="0,20,0,0">
    <StackPanel>
        <DockPanel>
            <TextBlock Text="First name:"/>
            <TextBox DockPanel.Dock="Right" Margin="5,0,0,0"/>
        </DockPanel>
        <DockPanel Margin="0,5,0,0">
            <TextBlock Text="Age:"/>
            <TextBox DockPanel.Dock="Right" Margin="5,0,0,0"/>
        </DockPanel>
        <DockPanel Margin="0,5,0,0">
            <TextBlock Text="Address:"/>
            <TextBox DockPanel.Dock="Right" Margin="5,0,0,0"/>
        </DockPanel>
    </StackPanel>
</Border>



Here is a first example of the GridSplitter control:
2017.06.19 - CSHTML5 GridSplitter1.png
2017.06.19 - CSHTML5 GridSplitter1.png (1.7 KiB) Viewed 11027 times

Code: Select all

<Grid x:Name="Grid1" Width="200" Height="100">
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="*" MinWidth="50" />
        <ColumnDefinition Width="5" />
        <ColumnDefinition Width="*" />
    </Grid.ColumnDefinitions>
    <Border Background="Blue" CornerRadius="2" Margin="2">
        <TextBlock HorizontalAlignment="Center" VerticalAlignment="Center" TextWrapping="Wrap" Foreground="White">Left side</TextBlock>
    </Border>
    <GridSplitter Grid.Column="1" HorizontalAlignment="Stretch"/>
    <Border Grid.Column="2" Background="Red" CornerRadius="2" Margin="2">
        <TextBlock HorizontalAlignment="Center" VerticalAlignment="Center" TextWrapping="Wrap" Foreground="White">Right side</TextBlock>
    </Border>
</Grid>



And here is a second example of the GridSplitter control:
2017.06.19 - CSHTML5 GridSplitter2.png
2017.06.19 - CSHTML5 GridSplitter2.png (2.62 KiB) Viewed 11027 times

Code: Select all

<Grid x:Name="Grid2" Width="200" Height="150" Background="Yellow" Margin="0,10,0,0">
    <Grid.RowDefinitions>
        <RowDefinition/>
        <RowDefinition Height="Auto"/>
        <RowDefinition/>
    </Grid.RowDefinitions>
    <TextBox Grid.Row="0" Text="Up text"/>
    <GridSplitter Grid.Row="1" Height="3" HorizontalAlignment="Stretch" VerticalAlignment="Center" Background="Azure"/>
    <TextBox Grid.Row="2" Text="Down text"/>
</Grid>



We also plan to update the Showcase app soon because it has not been updated in a while.

Thanks.
Regards,
JS-Support

zemorango
Posts: 36
Joined: Tue Feb 02, 2016 6:30 am

Re: New Beta 11.10 released! [Download] (DockPanel and GridSplitter!)

Postby zemorango » Wed Jun 21, 2017 1:52 am

Hi, JS-support ,thank's for the quick answer, :D I've tested again and it works great :), and I agree with you the showcase must be updated ;)

JS-Support @Userware
Site Admin
Posts: 1142
Joined: Tue Apr 08, 2014 3:42 pm

Re: New Beta 11.10 released! [Download] (DockPanel and GridSplitter!)

Postby JS-Support @Userware » Wed Jun 21, 2017 3:06 am

Thanks.


Return to “Pre-Releases, Downloads and Announcements”

Who is online

Users browsing this forum: No registered users and 7 guests