C#, UI, Windows 8, WinRT

Keyboard Dismissing ComboBox

In the last few days I came across a design issue with the touch keyboard on Windows 8. The keyboard dismissal logic (documented here) defines a list of controls which do not cause the keyboard to dismiss when they get focused. The purpose is to prevent the keyboard from opening and closing all the time when the user fills out a form and is likely to switch between keyboard-editable controls such as TextBox and other controls like AppBar, Checkbox, RadioButtons the ComboBox and some more. While that works fine with the other controls, ComboBox expands when interacted with and might get covered by the touch keyboard. And unfortunately you can’t change that behavior, or manually dismiss a deployed touch keyboard. (The user is in complete control over the keyboard.) While on the MSDN forums it was suggested to alter the layout such that the ComboBox is less likely to collide with the…

C#, Metro, UI, WinRT

TCD.Controls – Flyouts for XAML/C#

Hey there, Let’s start with the most important news: TCD.Controls is now available on NuGet (click here if you don’t know how this works, or why you want to use it) From now on, I won’t link *.zip packages with the sources anymore, because NuGet really make life easier. If you want access to the source files, just drop me an email There’s been one more or less important change to the Flyout control you should know about: It now has a property called “IsIgnoreLightDismissal”. To understand its purpose, imagine the following scenario (video below) You have a Button control that opens a FilePicker/FolderPicker, asking the user to select a File/Folder. This Button is hosted inside a Flyout control. Now when the user taps the Button, the Picker will popup, stealing the focus from your applications Window. Flyouts are required to hide on App-switch by the design guidelines, which is…

C#, WinRT

Exploring NuGet

Since 5 hours now, I ‘m on NuGet and I’d like to share my first experiences. Why did I join NuGet? I joined NuGet, because it seems to be the most comfortable way to share libraries, containing XAML controls. Share them between my own projects, as well as with you. Previously I always had to include the project containing the controls in the solution I was working on, which was really annoying.. How can you use it? Let’s assume that you want to use a package in your project. All you need is the NuGet Package Manager Visual Studio extension. You can install it via Tools/Extensions and Updates. To use/reference a package from NuGet right-click on the references in the solution explorer and select ‘Manage NuGet Packages’. Then you can search for the package you desire (for example ‘TCD.Serialization’) and add it to your project. How do I use it?…

Metro, Root, UI

Column-Styled GridView

Today I had to figure out a way to make a single-row, column-styled GridView that looked like this: Some minor design improvements are still to be made, but the hardest part is done. Particulary tricky was, that the items didn’t want to Stretch the height. (I wanted to avoid hard-coding the height, because of different screen resolutions.) Finally I’m using a GridView – I archived almost the same results with a ListView, but the ScrollBar was gone.. Maybe this is possible with a ListBox as well, but maybe I want to integrate this with a SemanticZoom control later, which requires ListView or GridView. Here’s a screenshot of the XAML code: You can copy/paste the following: <GridView ItemsSource=”{Binding Mensen}” SelectionChanged=”GridView_SelectionChanged”>                 <GridView.ItemTemplate>                     <DataTemplate>                         <Grid Background=”Green” Width=”250″>                             <Grid.RowDefinitions>                                 <RowDefinition Height=”Auto” />                                 <RowDefinition Height=”*” />                             </Grid.RowDefinitions>                             <TextBlock Grid.Row=”0″ Text=”{Binding Titel}” Foreground=”{StaticResource ListViewItemOverlayForegroundThemeBrush}” Style=”{StaticResource TitleTextStyle}” Height=”60″ Margin=”15,0,15,0″…

C#, Metro, WinRT

Migrating TCD to Windows 8 Release Preview

Two days ago, I migrated my laptop to Windows 8 Release Preview and today Windows Live Mesh finished syncing all of my files. So in the last few hours I migrated all the dev stuff and I’d like to share the latest versions of them too. Most of the libraries haven’t changed that much, only their namespaces have changed from TCD.Windows8.xxxx to TCD.xxxx. TCD.Serialization TCD.Serialization.Xml.XmlDeSerializer – (de)serialize an object from/to a string or Stream using XML TCD.Serialization.Json.JsonDeSerializer – (de)serialize an object from/to a string or Stream using JSON Download TCD.Serialization.zip TCD.Controls TCD.Controls.Flyout – create your own Flyout TCD.Controls.Settings.SettingsContractWrapper – integrate with the settings contract in just a few lines of code Download FlyoutAndSettingsSample.zip

C#, Metro, UI

SettingsContractWrapper – the easy way to integrate w/ settings

In the previous post I introduced the Flyout control. Now the most common use case for the Flyout controls is in the inegration with the settings contract. Integrating with the settings contract is usually a two-step procedure. First you have to add a SettingsCommand to the charm and then attach a Flyout or similar to it. Now that you have a Flyout you could do that on your own, but with the SettingsContractWrapper it is even more fun. To use it you  need to define one or more instances of SettingsEntry. This class holds the information required to set up the Flyout Its constructor takes three arguments: Title, FlyoutDimension, Content. The SettingsContractWrapper takes five arguments: Foreground, Background, Theme, Icon, SettingsEntries. The required namespaces are ‘TCD.Controls’ and ‘TCD.Controls.Settings’. As soon as you called the SettingsContractWrapper constructor you can forget about the settings contract integration. Just make sure that the UserControls you hand…

C#, Metro, Software, UI

Flyout control for Windows 8 Metro (XAML/C#)

IMPORTANT: This post ist partly outdated. TCD.Controls is now available on NuGet, so you don’t have to import the *.xaml into your project anymore! All code shown in this post still applies. Please refer to this post for more information on the changes. In Windows 8 Metro style apps there’s something called ‘Flyouts’. It’s a panel that slides in from the right. Sadly the control is not available to C#/VB developers. In this post Tim Heuer shows how to integrate with the settings contract using flyouts. Based on his code I developed a Flyout control for XAML/C# solutions. Here’s a list of what it can or can’t do: It does: light dismissal, back button easy integration of ‘content’ swipe-in transition custom color theme ‘narrow’ and ‘wide’ mode It does not: theming of the BackButton beeing attached to the left construct it in XAML I would like to provide you with a dll, but there’s a…