Cordova, Windows 10

Preventing Pinch-Zoom in Cordova on Windows 10 Mobile | Cordova

One of the most obvious ways to spot a Cordova app is a pinch-zoom inside the app. On Android and iOS you can use meta-tags and CSS to disable the pinch-zoom and over scroll. But for some reason I couldn’t get it disabled on Windows 10 mobile.

CSS, Design, HTML5, UWP app

Styling default JavaScript UWP app controls

When working on my drum machine app I started changing the look and feel a little. I started my changing the black and gray to some more bright colors. Pretty quickly I ran into some issues with changing the look and feel of the default controls. The blue color is specified as a named color ‘Highlight’, which seems to be controlled by Windows. After searching for quite a while I came across some MSDN documentation that describe a couple of vendor specific CSS pseudo-classes to alter various elements of the controls. The whole list of pseudo-classes you can use to…

CSS, Tools

Texture packer

When building my game Orbizoid I wanted to combine the images into sprite sheets. A sprite sheet is an image which contains a collection of images (sprites) that are used in a game or website. Because my game was build using HTML, JavaScript and CSS the use of sprites was very simple to do. The hard part was combining a whole lot of image into a sprite sheet. Until I came across Texture Packer. A little tool that can do a lot with sprites. Here’s how it works. Loading images When you open Texture Packer you start with a blank…

CSS, Expression Blend, HTML5, Windows Store apps

setting view states in HTML windows store apps using Blend

Intro From developing XAML applications I got used to working with the visual state manager to set various states of my applications and controls. In Windows Store apps that are build using XAML use the visual state manager to change various properties when the view state of the app changes. The app can be ran in fullscreen, filled or snapped state. When building Windows Store apps using HTML and JavaScript I wanted to show some UI different when the view state changes. One way to accomplish this is to change the CSS class of the elements from JavaScript. Just handle…

Expression Blend

Getting started with Metro, JS and blend

Intro In this first tutorial in a series about building a Windows 8 application with JavaScript, HMTL and CSS using Expression Blend 5, we’re going to make a start on a very simple game. In this game the player has to guess a random number between 1 and 10. The player wins if the guess is correct, and looses if it’s wrong. In future parts of the series this game will be extended to include various features of WinJS and Windows 8. File-New I’ve started with a new “Blank App” from the HTML list. I added a few HTML elements…

CSS, Expression Blend, HTML5, Windows 8

Discovering Expression Blend 5 – ListView

Often you need to display a list of items in a application. The Windows Library for JavaScript contains a ListView control for you to use in your applications. The control can be bound to a data source and templated from HTML. Getting started We’ll start off by creating a new project and choosing the Fixed Layout Application project template. As you can see, the template has added a paragraph (p) to the tree which contains some text. You can use that to place the title of your application. The ListView is going to be in the same div as that…

CSS, Expression Blend, HTML5

Discovering Expression Blend 5 – Styles

In my previous article I explained the different templates of the Expression Blend 5 preview. Today I would like to walk you through some of the basic of using CSS, or Cascading Style Sheets, in Expression Blend 5. You’ll need CSS to define the look and formatting of your Windows 8 Metro Style application.  Expression Blend 5 helps you create your styles in pretty much the same way you are used to when working on Silverlight or WPF applications in Expression Blend 4 and earlier. But not entirely.   Defining a style For sake of simplicity I’ve created a new…