Schlagwort: WP7

Grid Hintergrundbild setzen mit XAML

Im XAML-Code kann man Hintergrundbilder in verschiedenen Arten bestimmen.

Für einen einfarbigen Hintergrund bietet sich Folgendes an:

1
2

<Grid Background="White">
</Grid>

Will man selber ein Hintergrundbild setzen, kann man das so machen:

1
2
3
4
5

<Grid>
  <Grid.Background>
    <ImageBrush ImageSource="Image.jpg"/>
  </Grid.Background>
</Grid>

Es ist auch möglich, selbst definierte Ressourcen zu verwenden:
Windows Phone 7-Beispiel

1
2
3
4
5
6
7
8
9

<phone:PhoneApplicationPage
  xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
  ..>
  <phone:PhoneApplicationPage.Resources>
    <SolidColorBrush x:Key="MyBrush" Color="Gold"/>
  </phone:PhoneApplicationPage.Resources>
  <Grid Background="{StaticResource MyBrush}">
  </Grid>
</phone:PhoneApplicationPage>

Windows 8 App-Beispiel

1
2
3
4
5

<Page.Resources>
  <SolidColorBrush x:Key="MyBrush" Color="Gold"/>
</Page.Resources>
<Grid Background="{StaticResource MyBrush}">
</Grid>

Detect touchscreen devices with JavaScript

There are a lot of ways to detect touchscreen devices with JavaScript. Here are my favorites:

function isTouchDevice(){
  return (typeof(window.ontouchstart) != 'undefined') ? true : false;
}
function isTouchDevice(){
  return ('ontouchstart' in window) ? true : false;
}
function isTouchDevice(){
  return 'ontouchstart' in window;
}

Execution:

if(isTouchDevice())
  alert('Touch me!');
else
  alert('Click me!');

Please note: Windows Phone 7 does not support touch events that’s why you should do this:

function isTouchDevice(){
  if(navigator.userAgent.match('Windows Phone')){
    return true;
  }else{
    return 'ontouchstart' in window;
  }
}

What I also like is the following approach:

if (window.navigator.msPointerEnabled) {
  alert('IE10 / Windows 8 / Touch, pen and mouse');
}
else if('ontouchstart' in window){
  alert('touch device');
}
else{
  alert('mouse device');
}