SlideShare a Scribd company logo
1 of 27
Fundamental Training - 1
ME
Kevin R. Octavian
Mobile Developer
kevin.r.octavian@gmail.com
+62 857 2294 5257
kevin.r.octavian
@kevinroctavian
DAFTAR ISI
Windows 8 Controls (Action Controls & Layout Controls)
Data Binding
AppBars and Navigation
View
SQLite
Windows 8 Controls (Action Controls & Layout
Controls)
Action Controls
http://msdn.microsoft.com/library/windows/apps/hh465351.aspx
<TextBlock Foreground="White" Text="Ini TextBlock" FontFamily="Segoe
UI" FontSize="48" />
<TextBox Text="The quick brown fox..." Width="500"
FontFamily="Segoe UI" FontSize="30" />
<Button Content="Save" FontFamily="Segoe UI" FontSize="48" />
<RadioButton Content="Breakfast" GroupName="MealSelection"
FontFamily="Segoe UI" FontSize="48" />
<RadioButton Content="Lunch" GroupName="MealSelection"
FontFamily="Segoe UI" FontSize="48" />
<RadioButton Content="Dinner" GroupName="MealSelection"
FontFamily="Segoe UI" FontSize="48" />
<CheckBox Content="I agree to the terms I didn't read"
FontFamily="Segoe UI" FontSize="15" />
<ComboBox>
<ComboBoxItem Content="Breakfast" />
<ComboBoxItem Content="Second Breakfast" />
<ComboBoxItem Content="Elevenses" />
<ComboBoxItem Content="Luncheon" />
<ComboBoxItem Content="Afternoon Tea" />
<ComboBoxItem Content="Dinner" />
<ComboBoxItem Content="Supper" />
</ComboBox>
<Image Source="Assets/Logo.png" Width="200" Height="200" />
Layout Controls
http://msdn.microsoft.com/library/windows/apps/hh465351.aspx
<Canvas Width="120" Height="120"> <Rectangle
Fill="Red"/>
<Rectangle Fill="Blue" Canvas.Left="20"
Canvas.Top="20"/>
<Rectangle Fill="Green"
Canvas.Left="40" Canvas.Top="40"/>
<Rectangle Fill="Yellow"
Canvas.Left="60" Canvas.Top="60"/>
</Canvas>
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="50"/>
<RowDefinition Height="50"/>
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="50"/>
<ColumnDefinition Width="50"/>
</Grid.ColumnDefinitions>
<Rectangle Fill="Red"/>
<Rectangle Fill="Blue" Grid.Row="1"/>
<Rectangle Fill="Green" Grid.Column="1"/>
<Rectangle Fill="Yellow" Grid.Row="1"
Grid.Column="1"/>
</Grid>
<StackPanel>
<Rectangle Fill="Red"/> <Rectangle
Fill="Blue"/>
<Rectangle Fill="Green"/> <Rectangle
Fill="Yellow"/>
</StackPanel>
Layout Controls
http://msdn.microsoft.com/library/windows/apps/hh465351.aspx
<FlipView x:Name="flipView1"
SelectionChanged="FlipView_SelectionCha
nged">
<Image Source="Assets/Logo.png"
/>
<Image
Source="Assets/SplashScreen.png"
/>
<Image
Source="Assets/SmallLogo.png" />
</FlipView>
<GridView x:Name="gridView1"
SelectionChanged="GridView_SelectionChanged
">
<x:String>Item 1</x:String>
<x:String>Item 2</x:String>
</GridView>
<ListView x:Name="listView1"
SelectionChanged="ListView_SelectionChan
ged">
<x:String>Item 1</x:String>
<x:String>Item 2</x:String>
</ListView>
Demo
Windows 8 Controls (Action Controls & Layout
Controls)
Data Binding
public class Person : INotifyPropertyChanged
{
private string name;
private string phone;
private string photo;
public string Name {
get { return this.name; }
set { this.name = value; NotifyPropertyChanged("Name"); }
}
public string Photo
{
get { return this.photo; }
set { this.photo = value; NotifyPropertyChanged("Photo"); }
}
public string Phone
{
get { return this.phone; }
set { this.phone = value; NotifyPropertyChanged("Phone"); }
}
public event PropertyChangedEventHandler PropertyChanged;
private void NotifyPropertyChanged(string propName) {
if (PropertyChanged != null) {
PropertyChanged(this, new
PropertyChangedEventArgs(propName));
}
}
}
Data Binding
public class Persons : INotifyPropertyChanged
{
private ObservableCollection<Person> personList;
private string groupName;
public Persons() {
this.personList = new ObservableCollection<Person>();
}
public ObservableCollection<Person> PersonList {
get {
return this.personList;
}
}
public string GroupName {
get { return this.groupName; }
set { this.groupName = value; NotifyPropertyChanged("GroupName");
}
}
public event PropertyChangedEventHandler PropertyChanged;
private void NotifyPropertyChanged(string propName)
{
if (PropertyChanged != null)
{
PropertyChanged(this, new
PropertyChangedEventArgs(propName));
}
}
}
Data Binding
Persons persons = new Persons();
Person p = new Person();
p.Name = "Kevin R. Octavian";
p.Phone = "085722945257";
p.Photo = "";
Person p2 = new Person();
p2.Name = "Dadang";
p2.Phone = "085722945257";
p2.Photo = "";
persons.GroupName = "Kevin Lovers";
persons.PersonList.Add(p);
persons.PersonList.Add(p2);
this.DataContext = persons;
<ListView ItemsSource = "{Binding PersonList}">
<ListView.ItemTemplate>
<DataTemplate>
<StackPanel Orientation = "Horizontal">
<TextBlock Text = "{Binding Name}" Width = "100"/>
<TextBlock Text = "{Binding Phone}" Width = "200"/>
<TextBlock Text = "{Binding Photo}" Width = "300"/>
</StackPanel>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
Data Binding
Demo
AppBars and Navigation
AppBars
<Page.BottomAppBar>
<AppBar x:Name="bottomAppBar" Padding="10,0,10,0">
<Grid>
<StackPanel Orientation="Horizontal" HorizontalAlignment="Left">
<Button Style="{StaticResource EditAppBarButtonStyle}"
Click="Button_Click"/>
<Button Style="{StaticResource RemoveAppBarButtonStyle}"
Click="Button_Click"/>
<Button Style="{StaticResource AddAppBarButtonStyle}"
Click="Button_Click"/>
</StackPanel>
<StackPanel Orientation="Horizontal" HorizontalAlignment="Right">
<Button Style="{StaticResource RefreshAppBarButtonStyle}"
Click="Button_Click"/>
<Button Style="{StaticResource HelpAppBarButtonStyle}"
Click="Button_Click"/>
</StackPanel>
</Grid>
</AppBar>
</Page.BottomAppBar>
this.BottomAppBar.IsOpen = true;
Navigation
http://msdn.microsoft.com/library/windows/apps/hh771188.aspx
public BasicPage1() {
this.InitializeComponent();
this.NavigationCacheMode =
Windows.UI.Xaml.Navigation.NavigationCacheMode.Enabled;
}
this.Frame.Navigate(typeof(BasicPage2), tb1.Text);
this.Frame.Navigate(typeof(BasicPage2));
Demo
AppBars and Navigation
View
View
using System.Linq;
using Windows.Foundation;
using Windows.Foundation.Collections;
using Windows.UI.Xaml;
using Windows.UI.Xaml.Controls;
using Windows.UI.Xaml.Controls.Primitives;
using Windows.UI.Xaml.Data;
using Windows.UI.Xaml.Input;
using Windows.UI.Xaml.Media;
using Windows.UI.Xaml.Navigation;
using Windows.UI.ViewManagement;
namespace ViewsTile
{
public sealed partial class MainPage : Page
{
public MainPage()
{
this.InitializeComponent();
SizeChanged += DetailPage_SizeChanged;
}
void DetailPage_SizeChanged(object sender, SizeChangedEventArgs e) {
if (ApplicationView.Value == ApplicationViewState.Snapped) {
GridLayout.ColumnDefinitions[0].Width = new GridLength(0);
} else {
GridLayout.ColumnDefinitions[0].Width = new GridLength(1,
GridUnitType.Star);
}
}
}
}
View
<TextBlock x:Name="textSnap" Text="Kevin R. Octavian snap" Visibility="Collapsed" />
<TextBlock x:Name="textOthers" Text="Kevin R. Octavian others" />
<VisualStateManager.VisualStateGroups>
<!-- Visual states reflect the application's view state -->
<VisualStateGroup x:Name="ApplicationViewStates">
<VisualState x:Name="FullScreenLandscape"/>
<VisualState x:Name="Filled"/>
<VisualState x:Name="Others">
<Storyboard>
<ObjectAnimationUsingKeyFrames Storyboard.TargetName="textSnap" Storyboard.TargetProperty="Visibility">
<DiscreteObjectKeyFrame KeyTime="0" Value="Collapsed"/>
</ObjectAnimationUsingKeyFrames>
<ObjectAnimationUsingKeyFrames Storyboard.TargetName="textOthers" Storyboard.TargetProperty="Visibility">
<DiscreteObjectKeyFrame KeyTime="0" Value="Visible"/>
</ObjectAnimationUsingKeyFrames>
</Storyboard>
</VisualState>
<!-- The back button and title have different styles when snapped -->
<VisualState x:Name="Snapped">
<Storyboard>
<ObjectAnimationUsingKeyFrames Storyboard.TargetName="textSnap" Storyboard.TargetProperty="Visibility">
<DiscreteObjectKeyFrame KeyTime="0" Value="Visible"/>
</ObjectAnimationUsingKeyFrames>
<ObjectAnimationUsingKeyFrames Storyboard.TargetName="textOthers" Storyboard.TargetProperty="Visibility">
<DiscreteObjectKeyFrame KeyTime="0" Value="Collapsed"/>
</ObjectAnimationUsingKeyFrames>
</Storyboard>
</VisualState>
</VisualStateGroup>
</VisualStateManager.VisualStateGroups>
void DetailPage_SizeChanged(object sender, SizeChangedEventArgs e)
{
string stateName = ApplicationView.Value == ApplicationViewState.Snapped ?
"Snapped" : "Others"; VisualStateManager.GoToState(this, stateName, false);
}
View
Demo
View
SQLite
http://code.msdn.microsoft.com/windowsapps/Sqlite-For-Windows-8-Metro-2ec7a882
Create Table
try
{
var dbpath = Path.Combine(Windows.Storage.ApplicationData.Current.LocalFolder.Path, "data.db3");
using (var db = new SQLite.SQLiteConnection(dbpath))
{
// Create the tables if they don't exist
db.CreateTable<person>();
db.Commit();
db.Dispose();
db.Close();
}
var line = new MessageDialog("Table Created");
await line.ShowAsync();
}
catch
{
}
public class person
{
[MaxLength(5), PrimaryKey]
public String name { get; set; }
[MaxLength(255)]
public String address { get; set; }
[MaxLength(11)]
public Double phone { get; set; }
}
http://code.msdn.microsoft.com/windowsapps/Sqlite-For-Windows-8-Metro-2ec7a882
Insert Data
var dbpath = Path.Combine(Windows.Storage.ApplicationData.Current.LocalFolder.Path, "data.db3");
using (var db = new SQLite.SQLiteConnection(dbpath))
{
// Create the tables if they don't exist
db.Insert(new person()
{
name = txt1.Text.ToString(),
address = txt2.Text.ToString(),
phone = Convert.ToDouble(txt3.Text.ToString()),
}
);
db.Commit();
db.Dispose();
db.Close();
var line = new MessageDialog("Records Inserted");
await line.ShowAsync();
}
http://code.msdn.microsoft.com/windowsapps/Sqlite-For-Windows-8-Metro-2ec7a882
Select Data
var dbpath = Path.Combine(Windows.Storage.ApplicationData.Current.LocalFolder.Path, "data.db3");
using (var db = new SQLite.SQLiteConnection(dbpath))
{
var d = from x in db.Table<person>() select x;
list1.Items.Clear();
foreach (var sd in d)
{
list1.Items.Add(sd.name.ToString());
//list1.Items.Add(sd.address.ToString());
//list1.Items.Add(sd.phone.ToString());
}
db.Dispose();
db.Close();
}
var line = new MessageDialog("All Records Listed");
await line.ShowAsync();
http://code.msdn.microsoft.com/windowsapps/Sqlite-For-Windows-8-Metro-2ec7a882
Delete Data
var dbpath = Path.Combine(Windows.Storage.ApplicationData.Current.LocalFolder.Path, "data.db3");
using (var db = new SQLite.SQLiteConnection(dbpath))
{
db.Delete<person>(list1.SelectedItem.ToString());
var d = from x in db.Table<person>() select x;
list1.Items.Clear();
foreach (var sd in d)
{
list1.Items.Add(sd.name.ToString());
//list1.Items.Add(sd.address.ToString());
//list1.Items.Add(sd.phone.ToString());
}
db.Dispose();
db.Close();
}
var line = new MessageDialog("Selected Item Deleted");
await line.ShowAsync();
Demo
SQLite

More Related Content

What's hot

Bare-knuckle web development
Bare-knuckle web developmentBare-knuckle web development
Bare-knuckle web developmentJohannes Brodwall
 
Test and profile your Windows Phone 8 App
Test and profile your Windows Phone 8 AppTest and profile your Windows Phone 8 App
Test and profile your Windows Phone 8 AppMichele Capra
 
The Ring programming language version 1.5.1 book - Part 27 of 180
The Ring programming language version 1.5.1 book - Part 27 of 180The Ring programming language version 1.5.1 book - Part 27 of 180
The Ring programming language version 1.5.1 book - Part 27 of 180Mahmoud Samir Fayed
 
Testdrevet javautvikling på objektorienterte skinner
Testdrevet javautvikling på objektorienterte skinnerTestdrevet javautvikling på objektorienterte skinner
Testdrevet javautvikling på objektorienterte skinnerTruls Jørgensen
 
The Ring programming language version 1.10 book - Part 37 of 212
The Ring programming language version 1.10 book - Part 37 of 212The Ring programming language version 1.10 book - Part 37 of 212
The Ring programming language version 1.10 book - Part 37 of 212Mahmoud Samir Fayed
 
Rapid development tools for java ee 8 and micro profile [GIDS]
Rapid development tools for java ee 8 and micro profile [GIDS] Rapid development tools for java ee 8 and micro profile [GIDS]
Rapid development tools for java ee 8 and micro profile [GIDS] Payara
 
The Ring programming language version 1.6 book - Part 31 of 189
The Ring programming language version 1.6 book - Part 31 of 189The Ring programming language version 1.6 book - Part 31 of 189
The Ring programming language version 1.6 book - Part 31 of 189Mahmoud Samir Fayed
 
Hitchhiker's guide to the win8
Hitchhiker's guide to the win8Hitchhiker's guide to the win8
Hitchhiker's guide to the win8Jua Alice Kim
 
The Ring programming language version 1.5.4 book - Part 29 of 185
The Ring programming language version 1.5.4 book - Part 29 of 185The Ring programming language version 1.5.4 book - Part 29 of 185
The Ring programming language version 1.5.4 book - Part 29 of 185Mahmoud Samir Fayed
 
Stay with React.js in 2020
Stay with React.js in 2020Stay with React.js in 2020
Stay with React.js in 2020Jerry Liao
 
The Principle of Hybrid App.
The Principle of Hybrid App.The Principle of Hybrid App.
The Principle of Hybrid App.musart Park
 
Android Testing
Android TestingAndroid Testing
Android TestingEvan Lin
 
Architecture Components
Architecture Components Architecture Components
Architecture Components DataArt
 
The Ring programming language version 1.9 book - Part 36 of 210
The Ring programming language version 1.9 book - Part 36 of 210The Ring programming language version 1.9 book - Part 36 of 210
The Ring programming language version 1.9 book - Part 36 of 210Mahmoud Samir Fayed
 
The Ring programming language version 1.5.2 book - Part 28 of 181
The Ring programming language version 1.5.2 book - Part 28 of 181The Ring programming language version 1.5.2 book - Part 28 of 181
The Ring programming language version 1.5.2 book - Part 28 of 181Mahmoud Samir Fayed
 
Clustering your Application with Hazelcast
Clustering your Application with HazelcastClustering your Application with Hazelcast
Clustering your Application with HazelcastHazelcast
 
JS Fest 2019. Glenn Reyes. With great power comes great React hooks!
JS Fest 2019. Glenn Reyes. With great power comes great React hooks!JS Fest 2019. Glenn Reyes. With great power comes great React hooks!
JS Fest 2019. Glenn Reyes. With great power comes great React hooks!JSFestUA
 

What's hot (20)

Bare-knuckle web development
Bare-knuckle web developmentBare-knuckle web development
Bare-knuckle web development
 
Test and profile your Windows Phone 8 App
Test and profile your Windows Phone 8 AppTest and profile your Windows Phone 8 App
Test and profile your Windows Phone 8 App
 
The Ring programming language version 1.5.1 book - Part 27 of 180
The Ring programming language version 1.5.1 book - Part 27 of 180The Ring programming language version 1.5.1 book - Part 27 of 180
The Ring programming language version 1.5.1 book - Part 27 of 180
 
Testdrevet javautvikling på objektorienterte skinner
Testdrevet javautvikling på objektorienterte skinnerTestdrevet javautvikling på objektorienterte skinner
Testdrevet javautvikling på objektorienterte skinner
 
The Ring programming language version 1.10 book - Part 37 of 212
The Ring programming language version 1.10 book - Part 37 of 212The Ring programming language version 1.10 book - Part 37 of 212
The Ring programming language version 1.10 book - Part 37 of 212
 
Rapid development tools for java ee 8 and micro profile [GIDS]
Rapid development tools for java ee 8 and micro profile [GIDS] Rapid development tools for java ee 8 and micro profile [GIDS]
Rapid development tools for java ee 8 and micro profile [GIDS]
 
The Ring programming language version 1.6 book - Part 31 of 189
The Ring programming language version 1.6 book - Part 31 of 189The Ring programming language version 1.6 book - Part 31 of 189
The Ring programming language version 1.6 book - Part 31 of 189
 
Metaworks3
Metaworks3Metaworks3
Metaworks3
 
Hitchhiker's guide to the win8
Hitchhiker's guide to the win8Hitchhiker's guide to the win8
Hitchhiker's guide to the win8
 
Matreshka.js
Matreshka.jsMatreshka.js
Matreshka.js
 
Matreshka.js
Matreshka.jsMatreshka.js
Matreshka.js
 
The Ring programming language version 1.5.4 book - Part 29 of 185
The Ring programming language version 1.5.4 book - Part 29 of 185The Ring programming language version 1.5.4 book - Part 29 of 185
The Ring programming language version 1.5.4 book - Part 29 of 185
 
Stay with React.js in 2020
Stay with React.js in 2020Stay with React.js in 2020
Stay with React.js in 2020
 
The Principle of Hybrid App.
The Principle of Hybrid App.The Principle of Hybrid App.
The Principle of Hybrid App.
 
Android Testing
Android TestingAndroid Testing
Android Testing
 
Architecture Components
Architecture Components Architecture Components
Architecture Components
 
The Ring programming language version 1.9 book - Part 36 of 210
The Ring programming language version 1.9 book - Part 36 of 210The Ring programming language version 1.9 book - Part 36 of 210
The Ring programming language version 1.9 book - Part 36 of 210
 
The Ring programming language version 1.5.2 book - Part 28 of 181
The Ring programming language version 1.5.2 book - Part 28 of 181The Ring programming language version 1.5.2 book - Part 28 of 181
The Ring programming language version 1.5.2 book - Part 28 of 181
 
Clustering your Application with Hazelcast
Clustering your Application with HazelcastClustering your Application with Hazelcast
Clustering your Application with Hazelcast
 
JS Fest 2019. Glenn Reyes. With great power comes great React hooks!
JS Fest 2019. Glenn Reyes. With great power comes great React hooks!JS Fest 2019. Glenn Reyes. With great power comes great React hooks!
JS Fest 2019. Glenn Reyes. With great power comes great React hooks!
 

Similar to Windows 8 Training Fundamental - 1

EclipseCon2011 Cross-Platform Mobile Development with Eclipse
EclipseCon2011 Cross-Platform Mobile Development with EclipseEclipseCon2011 Cross-Platform Mobile Development with Eclipse
EclipseCon2011 Cross-Platform Mobile Development with EclipseHeiko Behrens
 
How to Bring Common UI Patterns to ADF
How to Bring Common UI Patterns to ADF How to Bring Common UI Patterns to ADF
How to Bring Common UI Patterns to ADF Luc Bors
 
Backbone.js — Introduction to client-side JavaScript MVC
Backbone.js — Introduction to client-side JavaScript MVCBackbone.js — Introduction to client-side JavaScript MVC
Backbone.js — Introduction to client-side JavaScript MVCpootsbook
 
Getting started with Elasticsearch and .NET
Getting started with Elasticsearch and .NETGetting started with Elasticsearch and .NET
Getting started with Elasticsearch and .NETTomas Jansson
 
比XML更好用的Java Annotation
比XML更好用的Java Annotation比XML更好用的Java Annotation
比XML更好用的Java Annotationjavatwo2011
 
Improving android experience for both users and developers
Improving android experience for both users and developersImproving android experience for both users and developers
Improving android experience for both users and developersPavel Lahoda
 
Droidcon2013 android experience lahoda
Droidcon2013 android experience lahodaDroidcon2013 android experience lahoda
Droidcon2013 android experience lahodaDroidcon Berlin
 
Architecture components - IT Talk
Architecture components - IT TalkArchitecture components - IT Talk
Architecture components - IT TalkConstantine Mars
 
netmind - Primer Contacto con el Desarrollo de Aplicaciones para Windows 8
netmind - Primer Contacto con el Desarrollo de Aplicaciones para Windows 8netmind - Primer Contacto con el Desarrollo de Aplicaciones para Windows 8
netmind - Primer Contacto con el Desarrollo de Aplicaciones para Windows 8netmind
 
Teste de Integração com DbUnit e jIntegrity
Teste de Integração com DbUnit e jIntegrityTeste de Integração com DbUnit e jIntegrity
Teste de Integração com DbUnit e jIntegrityWashington Botelho
 
Struts database access
Struts database accessStruts database access
Struts database accessAbass Ndiaye
 
Effective Android Data Binding
Effective Android Data BindingEffective Android Data Binding
Effective Android Data BindingEric Maxwell
 
Vertx - Reactive & Distributed
Vertx - Reactive & DistributedVertx - Reactive & Distributed
Vertx - Reactive & DistributedOrkhan Gasimov
 
"Android Data Binding в массы" Михаил Анохин
"Android Data Binding в массы" Михаил Анохин"Android Data Binding в массы" Михаил Анохин
"Android Data Binding в массы" Михаил АнохинFwdays
 

Similar to Windows 8 Training Fundamental - 1 (20)

EclipseCon2011 Cross-Platform Mobile Development with Eclipse
EclipseCon2011 Cross-Platform Mobile Development with EclipseEclipseCon2011 Cross-Platform Mobile Development with Eclipse
EclipseCon2011 Cross-Platform Mobile Development with Eclipse
 
How te bring common UI patterns to ADF
How te bring common UI patterns to ADFHow te bring common UI patterns to ADF
How te bring common UI patterns to ADF
 
How to Bring Common UI Patterns to ADF
How to Bring Common UI Patterns to ADF How to Bring Common UI Patterns to ADF
How to Bring Common UI Patterns to ADF
 
Backbone.js — Introduction to client-side JavaScript MVC
Backbone.js — Introduction to client-side JavaScript MVCBackbone.js — Introduction to client-side JavaScript MVC
Backbone.js — Introduction to client-side JavaScript MVC
 
Getting started with Elasticsearch and .NET
Getting started with Elasticsearch and .NETGetting started with Elasticsearch and .NET
Getting started with Elasticsearch and .NET
 
比XML更好用的Java Annotation
比XML更好用的Java Annotation比XML更好用的Java Annotation
比XML更好用的Java Annotation
 
Improving android experience for both users and developers
Improving android experience for both users and developersImproving android experience for both users and developers
Improving android experience for both users and developers
 
Droidcon2013 android experience lahoda
Droidcon2013 android experience lahodaDroidcon2013 android experience lahoda
Droidcon2013 android experience lahoda
 
Dropwizard
DropwizardDropwizard
Dropwizard
 
SQLite with UWP
SQLite with UWPSQLite with UWP
SQLite with UWP
 
Android crashcourse
Android crashcourseAndroid crashcourse
Android crashcourse
 
Practica n° 7
Practica n° 7Practica n° 7
Practica n° 7
 
Architecture components - IT Talk
Architecture components - IT TalkArchitecture components - IT Talk
Architecture components - IT Talk
 
netmind - Primer Contacto con el Desarrollo de Aplicaciones para Windows 8
netmind - Primer Contacto con el Desarrollo de Aplicaciones para Windows 8netmind - Primer Contacto con el Desarrollo de Aplicaciones para Windows 8
netmind - Primer Contacto con el Desarrollo de Aplicaciones para Windows 8
 
Teste de Integração com DbUnit e jIntegrity
Teste de Integração com DbUnit e jIntegrityTeste de Integração com DbUnit e jIntegrity
Teste de Integração com DbUnit e jIntegrity
 
Struts database access
Struts database accessStruts database access
Struts database access
 
Backbone.js
Backbone.jsBackbone.js
Backbone.js
 
Effective Android Data Binding
Effective Android Data BindingEffective Android Data Binding
Effective Android Data Binding
 
Vertx - Reactive & Distributed
Vertx - Reactive & DistributedVertx - Reactive & Distributed
Vertx - Reactive & Distributed
 
"Android Data Binding в массы" Михаил Анохин
"Android Data Binding в массы" Михаил Анохин"Android Data Binding в массы" Михаил Анохин
"Android Data Binding в массы" Михаил Анохин
 

Recently uploaded

Keynote by Prof. Wurzer at Nordex about IP-design
Keynote by Prof. Wurzer at Nordex about IP-designKeynote by Prof. Wurzer at Nordex about IP-design
Keynote by Prof. Wurzer at Nordex about IP-designMIPLM
 
ANG SEKTOR NG agrikultura.pptx QUARTER 4
ANG SEKTOR NG agrikultura.pptx QUARTER 4ANG SEKTOR NG agrikultura.pptx QUARTER 4
ANG SEKTOR NG agrikultura.pptx QUARTER 4MiaBumagat1
 
INTRODUCTION TO CATHOLIC CHRISTOLOGY.pptx
INTRODUCTION TO CATHOLIC CHRISTOLOGY.pptxINTRODUCTION TO CATHOLIC CHRISTOLOGY.pptx
INTRODUCTION TO CATHOLIC CHRISTOLOGY.pptxHumphrey A Beña
 
ICS2208 Lecture6 Notes for SL spaces.pdf
ICS2208 Lecture6 Notes for SL spaces.pdfICS2208 Lecture6 Notes for SL spaces.pdf
ICS2208 Lecture6 Notes for SL spaces.pdfVanessa Camilleri
 
Expanded definition: technical and operational
Expanded definition: technical and operationalExpanded definition: technical and operational
Expanded definition: technical and operationalssuser3e220a
 
The Contemporary World: The Globalization of World Politics
The Contemporary World: The Globalization of World PoliticsThe Contemporary World: The Globalization of World Politics
The Contemporary World: The Globalization of World PoliticsRommel Regala
 
Textual Evidence in Reading and Writing of SHS
Textual Evidence in Reading and Writing of SHSTextual Evidence in Reading and Writing of SHS
Textual Evidence in Reading and Writing of SHSMae Pangan
 
ROLES IN A STAGE PRODUCTION in arts.pptx
ROLES IN A STAGE PRODUCTION in arts.pptxROLES IN A STAGE PRODUCTION in arts.pptx
ROLES IN A STAGE PRODUCTION in arts.pptxVanesaIglesias10
 
Millenials and Fillennials (Ethical Challenge and Responses).pptx
Millenials and Fillennials (Ethical Challenge and Responses).pptxMillenials and Fillennials (Ethical Challenge and Responses).pptx
Millenials and Fillennials (Ethical Challenge and Responses).pptxJanEmmanBrigoli
 
USPS® Forced Meter Migration - How to Know if Your Postage Meter Will Soon be...
USPS® Forced Meter Migration - How to Know if Your Postage Meter Will Soon be...USPS® Forced Meter Migration - How to Know if Your Postage Meter Will Soon be...
USPS® Forced Meter Migration - How to Know if Your Postage Meter Will Soon be...Postal Advocate Inc.
 
4.16.24 Poverty and Precarity--Desmond.pptx
4.16.24 Poverty and Precarity--Desmond.pptx4.16.24 Poverty and Precarity--Desmond.pptx
4.16.24 Poverty and Precarity--Desmond.pptxmary850239
 
Grade 9 Quarter 4 Dll Grade 9 Quarter 4 DLL.pdf
Grade 9 Quarter 4 Dll Grade 9 Quarter 4 DLL.pdfGrade 9 Quarter 4 Dll Grade 9 Quarter 4 DLL.pdf
Grade 9 Quarter 4 Dll Grade 9 Quarter 4 DLL.pdfJemuel Francisco
 
ClimART Action | eTwinning Project
ClimART Action    |    eTwinning ProjectClimART Action    |    eTwinning Project
ClimART Action | eTwinning Projectjordimapav
 
How to do quick user assign in kanban in Odoo 17 ERP
How to do quick user assign in kanban in Odoo 17 ERPHow to do quick user assign in kanban in Odoo 17 ERP
How to do quick user assign in kanban in Odoo 17 ERPCeline George
 
Visit to a blind student's school🧑‍🦯🧑‍🦯(community medicine)
Visit to a blind student's school🧑‍🦯🧑‍🦯(community medicine)Visit to a blind student's school🧑‍🦯🧑‍🦯(community medicine)
Visit to a blind student's school🧑‍🦯🧑‍🦯(community medicine)lakshayb543
 
Choosing the Right CBSE School A Comprehensive Guide for Parents
Choosing the Right CBSE School A Comprehensive Guide for ParentsChoosing the Right CBSE School A Comprehensive Guide for Parents
Choosing the Right CBSE School A Comprehensive Guide for Parentsnavabharathschool99
 
Dust Of Snow By Robert Frost Class-X English CBSE
Dust Of Snow By Robert Frost Class-X English CBSEDust Of Snow By Robert Frost Class-X English CBSE
Dust Of Snow By Robert Frost Class-X English CBSEaurabinda banchhor
 

Recently uploaded (20)

Keynote by Prof. Wurzer at Nordex about IP-design
Keynote by Prof. Wurzer at Nordex about IP-designKeynote by Prof. Wurzer at Nordex about IP-design
Keynote by Prof. Wurzer at Nordex about IP-design
 
ANG SEKTOR NG agrikultura.pptx QUARTER 4
ANG SEKTOR NG agrikultura.pptx QUARTER 4ANG SEKTOR NG agrikultura.pptx QUARTER 4
ANG SEKTOR NG agrikultura.pptx QUARTER 4
 
INTRODUCTION TO CATHOLIC CHRISTOLOGY.pptx
INTRODUCTION TO CATHOLIC CHRISTOLOGY.pptxINTRODUCTION TO CATHOLIC CHRISTOLOGY.pptx
INTRODUCTION TO CATHOLIC CHRISTOLOGY.pptx
 
ICS2208 Lecture6 Notes for SL spaces.pdf
ICS2208 Lecture6 Notes for SL spaces.pdfICS2208 Lecture6 Notes for SL spaces.pdf
ICS2208 Lecture6 Notes for SL spaces.pdf
 
Expanded definition: technical and operational
Expanded definition: technical and operationalExpanded definition: technical and operational
Expanded definition: technical and operational
 
The Contemporary World: The Globalization of World Politics
The Contemporary World: The Globalization of World PoliticsThe Contemporary World: The Globalization of World Politics
The Contemporary World: The Globalization of World Politics
 
Textual Evidence in Reading and Writing of SHS
Textual Evidence in Reading and Writing of SHSTextual Evidence in Reading and Writing of SHS
Textual Evidence in Reading and Writing of SHS
 
ROLES IN A STAGE PRODUCTION in arts.pptx
ROLES IN A STAGE PRODUCTION in arts.pptxROLES IN A STAGE PRODUCTION in arts.pptx
ROLES IN A STAGE PRODUCTION in arts.pptx
 
LEFT_ON_C'N_ PRELIMS_EL_DORADO_2024.pptx
LEFT_ON_C'N_ PRELIMS_EL_DORADO_2024.pptxLEFT_ON_C'N_ PRELIMS_EL_DORADO_2024.pptx
LEFT_ON_C'N_ PRELIMS_EL_DORADO_2024.pptx
 
Millenials and Fillennials (Ethical Challenge and Responses).pptx
Millenials and Fillennials (Ethical Challenge and Responses).pptxMillenials and Fillennials (Ethical Challenge and Responses).pptx
Millenials and Fillennials (Ethical Challenge and Responses).pptx
 
USPS® Forced Meter Migration - How to Know if Your Postage Meter Will Soon be...
USPS® Forced Meter Migration - How to Know if Your Postage Meter Will Soon be...USPS® Forced Meter Migration - How to Know if Your Postage Meter Will Soon be...
USPS® Forced Meter Migration - How to Know if Your Postage Meter Will Soon be...
 
4.16.24 Poverty and Precarity--Desmond.pptx
4.16.24 Poverty and Precarity--Desmond.pptx4.16.24 Poverty and Precarity--Desmond.pptx
4.16.24 Poverty and Precarity--Desmond.pptx
 
Grade 9 Quarter 4 Dll Grade 9 Quarter 4 DLL.pdf
Grade 9 Quarter 4 Dll Grade 9 Quarter 4 DLL.pdfGrade 9 Quarter 4 Dll Grade 9 Quarter 4 DLL.pdf
Grade 9 Quarter 4 Dll Grade 9 Quarter 4 DLL.pdf
 
ClimART Action | eTwinning Project
ClimART Action    |    eTwinning ProjectClimART Action    |    eTwinning Project
ClimART Action | eTwinning Project
 
How to do quick user assign in kanban in Odoo 17 ERP
How to do quick user assign in kanban in Odoo 17 ERPHow to do quick user assign in kanban in Odoo 17 ERP
How to do quick user assign in kanban in Odoo 17 ERP
 
Visit to a blind student's school🧑‍🦯🧑‍🦯(community medicine)
Visit to a blind student's school🧑‍🦯🧑‍🦯(community medicine)Visit to a blind student's school🧑‍🦯🧑‍🦯(community medicine)
Visit to a blind student's school🧑‍🦯🧑‍🦯(community medicine)
 
Choosing the Right CBSE School A Comprehensive Guide for Parents
Choosing the Right CBSE School A Comprehensive Guide for ParentsChoosing the Right CBSE School A Comprehensive Guide for Parents
Choosing the Right CBSE School A Comprehensive Guide for Parents
 
YOUVE GOT EMAIL_FINALS_EL_DORADO_2024.pptx
YOUVE GOT EMAIL_FINALS_EL_DORADO_2024.pptxYOUVE GOT EMAIL_FINALS_EL_DORADO_2024.pptx
YOUVE GOT EMAIL_FINALS_EL_DORADO_2024.pptx
 
FINALS_OF_LEFT_ON_C'N_EL_DORADO_2024.pptx
FINALS_OF_LEFT_ON_C'N_EL_DORADO_2024.pptxFINALS_OF_LEFT_ON_C'N_EL_DORADO_2024.pptx
FINALS_OF_LEFT_ON_C'N_EL_DORADO_2024.pptx
 
Dust Of Snow By Robert Frost Class-X English CBSE
Dust Of Snow By Robert Frost Class-X English CBSEDust Of Snow By Robert Frost Class-X English CBSE
Dust Of Snow By Robert Frost Class-X English CBSE
 

Windows 8 Training Fundamental - 1

  • 2. ME Kevin R. Octavian Mobile Developer kevin.r.octavian@gmail.com +62 857 2294 5257 kevin.r.octavian @kevinroctavian
  • 3. DAFTAR ISI Windows 8 Controls (Action Controls & Layout Controls) Data Binding AppBars and Navigation View SQLite
  • 4. Windows 8 Controls (Action Controls & Layout Controls)
  • 5. Action Controls http://msdn.microsoft.com/library/windows/apps/hh465351.aspx <TextBlock Foreground="White" Text="Ini TextBlock" FontFamily="Segoe UI" FontSize="48" /> <TextBox Text="The quick brown fox..." Width="500" FontFamily="Segoe UI" FontSize="30" /> <Button Content="Save" FontFamily="Segoe UI" FontSize="48" /> <RadioButton Content="Breakfast" GroupName="MealSelection" FontFamily="Segoe UI" FontSize="48" /> <RadioButton Content="Lunch" GroupName="MealSelection" FontFamily="Segoe UI" FontSize="48" /> <RadioButton Content="Dinner" GroupName="MealSelection" FontFamily="Segoe UI" FontSize="48" /> <CheckBox Content="I agree to the terms I didn't read" FontFamily="Segoe UI" FontSize="15" /> <ComboBox> <ComboBoxItem Content="Breakfast" /> <ComboBoxItem Content="Second Breakfast" /> <ComboBoxItem Content="Elevenses" /> <ComboBoxItem Content="Luncheon" /> <ComboBoxItem Content="Afternoon Tea" /> <ComboBoxItem Content="Dinner" /> <ComboBoxItem Content="Supper" /> </ComboBox> <Image Source="Assets/Logo.png" Width="200" Height="200" />
  • 6. Layout Controls http://msdn.microsoft.com/library/windows/apps/hh465351.aspx <Canvas Width="120" Height="120"> <Rectangle Fill="Red"/> <Rectangle Fill="Blue" Canvas.Left="20" Canvas.Top="20"/> <Rectangle Fill="Green" Canvas.Left="40" Canvas.Top="40"/> <Rectangle Fill="Yellow" Canvas.Left="60" Canvas.Top="60"/> </Canvas> <Grid> <Grid.RowDefinitions> <RowDefinition Height="50"/> <RowDefinition Height="50"/> </Grid.RowDefinitions> <Grid.ColumnDefinitions> <ColumnDefinition Width="50"/> <ColumnDefinition Width="50"/> </Grid.ColumnDefinitions> <Rectangle Fill="Red"/> <Rectangle Fill="Blue" Grid.Row="1"/> <Rectangle Fill="Green" Grid.Column="1"/> <Rectangle Fill="Yellow" Grid.Row="1" Grid.Column="1"/> </Grid> <StackPanel> <Rectangle Fill="Red"/> <Rectangle Fill="Blue"/> <Rectangle Fill="Green"/> <Rectangle Fill="Yellow"/> </StackPanel>
  • 7. Layout Controls http://msdn.microsoft.com/library/windows/apps/hh465351.aspx <FlipView x:Name="flipView1" SelectionChanged="FlipView_SelectionCha nged"> <Image Source="Assets/Logo.png" /> <Image Source="Assets/SplashScreen.png" /> <Image Source="Assets/SmallLogo.png" /> </FlipView> <GridView x:Name="gridView1" SelectionChanged="GridView_SelectionChanged "> <x:String>Item 1</x:String> <x:String>Item 2</x:String> </GridView> <ListView x:Name="listView1" SelectionChanged="ListView_SelectionChan ged"> <x:String>Item 1</x:String> <x:String>Item 2</x:String> </ListView>
  • 8. Demo Windows 8 Controls (Action Controls & Layout Controls)
  • 10. public class Person : INotifyPropertyChanged { private string name; private string phone; private string photo; public string Name { get { return this.name; } set { this.name = value; NotifyPropertyChanged("Name"); } } public string Photo { get { return this.photo; } set { this.photo = value; NotifyPropertyChanged("Photo"); } } public string Phone { get { return this.phone; } set { this.phone = value; NotifyPropertyChanged("Phone"); } } public event PropertyChangedEventHandler PropertyChanged; private void NotifyPropertyChanged(string propName) { if (PropertyChanged != null) { PropertyChanged(this, new PropertyChangedEventArgs(propName)); } } } Data Binding public class Persons : INotifyPropertyChanged { private ObservableCollection<Person> personList; private string groupName; public Persons() { this.personList = new ObservableCollection<Person>(); } public ObservableCollection<Person> PersonList { get { return this.personList; } } public string GroupName { get { return this.groupName; } set { this.groupName = value; NotifyPropertyChanged("GroupName"); } } public event PropertyChangedEventHandler PropertyChanged; private void NotifyPropertyChanged(string propName) { if (PropertyChanged != null) { PropertyChanged(this, new PropertyChangedEventArgs(propName)); } } }
  • 11. Data Binding Persons persons = new Persons(); Person p = new Person(); p.Name = "Kevin R. Octavian"; p.Phone = "085722945257"; p.Photo = ""; Person p2 = new Person(); p2.Name = "Dadang"; p2.Phone = "085722945257"; p2.Photo = ""; persons.GroupName = "Kevin Lovers"; persons.PersonList.Add(p); persons.PersonList.Add(p2); this.DataContext = persons; <ListView ItemsSource = "{Binding PersonList}"> <ListView.ItemTemplate> <DataTemplate> <StackPanel Orientation = "Horizontal"> <TextBlock Text = "{Binding Name}" Width = "100"/> <TextBlock Text = "{Binding Phone}" Width = "200"/> <TextBlock Text = "{Binding Photo}" Width = "300"/> </StackPanel> </DataTemplate> </ListView.ItemTemplate> </ListView>
  • 14. AppBars <Page.BottomAppBar> <AppBar x:Name="bottomAppBar" Padding="10,0,10,0"> <Grid> <StackPanel Orientation="Horizontal" HorizontalAlignment="Left"> <Button Style="{StaticResource EditAppBarButtonStyle}" Click="Button_Click"/> <Button Style="{StaticResource RemoveAppBarButtonStyle}" Click="Button_Click"/> <Button Style="{StaticResource AddAppBarButtonStyle}" Click="Button_Click"/> </StackPanel> <StackPanel Orientation="Horizontal" HorizontalAlignment="Right"> <Button Style="{StaticResource RefreshAppBarButtonStyle}" Click="Button_Click"/> <Button Style="{StaticResource HelpAppBarButtonStyle}" Click="Button_Click"/> </StackPanel> </Grid> </AppBar> </Page.BottomAppBar> this.BottomAppBar.IsOpen = true;
  • 15. Navigation http://msdn.microsoft.com/library/windows/apps/hh771188.aspx public BasicPage1() { this.InitializeComponent(); this.NavigationCacheMode = Windows.UI.Xaml.Navigation.NavigationCacheMode.Enabled; } this.Frame.Navigate(typeof(BasicPage2), tb1.Text); this.Frame.Navigate(typeof(BasicPage2));
  • 17. View
  • 18. View
  • 19. using System.Linq; using Windows.Foundation; using Windows.Foundation.Collections; using Windows.UI.Xaml; using Windows.UI.Xaml.Controls; using Windows.UI.Xaml.Controls.Primitives; using Windows.UI.Xaml.Data; using Windows.UI.Xaml.Input; using Windows.UI.Xaml.Media; using Windows.UI.Xaml.Navigation; using Windows.UI.ViewManagement; namespace ViewsTile { public sealed partial class MainPage : Page { public MainPage() { this.InitializeComponent(); SizeChanged += DetailPage_SizeChanged; } void DetailPage_SizeChanged(object sender, SizeChangedEventArgs e) { if (ApplicationView.Value == ApplicationViewState.Snapped) { GridLayout.ColumnDefinitions[0].Width = new GridLength(0); } else { GridLayout.ColumnDefinitions[0].Width = new GridLength(1, GridUnitType.Star); } } } } View
  • 20. <TextBlock x:Name="textSnap" Text="Kevin R. Octavian snap" Visibility="Collapsed" /> <TextBlock x:Name="textOthers" Text="Kevin R. Octavian others" /> <VisualStateManager.VisualStateGroups> <!-- Visual states reflect the application's view state --> <VisualStateGroup x:Name="ApplicationViewStates"> <VisualState x:Name="FullScreenLandscape"/> <VisualState x:Name="Filled"/> <VisualState x:Name="Others"> <Storyboard> <ObjectAnimationUsingKeyFrames Storyboard.TargetName="textSnap" Storyboard.TargetProperty="Visibility"> <DiscreteObjectKeyFrame KeyTime="0" Value="Collapsed"/> </ObjectAnimationUsingKeyFrames> <ObjectAnimationUsingKeyFrames Storyboard.TargetName="textOthers" Storyboard.TargetProperty="Visibility"> <DiscreteObjectKeyFrame KeyTime="0" Value="Visible"/> </ObjectAnimationUsingKeyFrames> </Storyboard> </VisualState> <!-- The back button and title have different styles when snapped --> <VisualState x:Name="Snapped"> <Storyboard> <ObjectAnimationUsingKeyFrames Storyboard.TargetName="textSnap" Storyboard.TargetProperty="Visibility"> <DiscreteObjectKeyFrame KeyTime="0" Value="Visible"/> </ObjectAnimationUsingKeyFrames> <ObjectAnimationUsingKeyFrames Storyboard.TargetName="textOthers" Storyboard.TargetProperty="Visibility"> <DiscreteObjectKeyFrame KeyTime="0" Value="Collapsed"/> </ObjectAnimationUsingKeyFrames> </Storyboard> </VisualState> </VisualStateGroup> </VisualStateManager.VisualStateGroups> void DetailPage_SizeChanged(object sender, SizeChangedEventArgs e) { string stateName = ApplicationView.Value == ApplicationViewState.Snapped ? "Snapped" : "Others"; VisualStateManager.GoToState(this, stateName, false); } View
  • 23. http://code.msdn.microsoft.com/windowsapps/Sqlite-For-Windows-8-Metro-2ec7a882 Create Table try { var dbpath = Path.Combine(Windows.Storage.ApplicationData.Current.LocalFolder.Path, "data.db3"); using (var db = new SQLite.SQLiteConnection(dbpath)) { // Create the tables if they don't exist db.CreateTable<person>(); db.Commit(); db.Dispose(); db.Close(); } var line = new MessageDialog("Table Created"); await line.ShowAsync(); } catch { } public class person { [MaxLength(5), PrimaryKey] public String name { get; set; } [MaxLength(255)] public String address { get; set; } [MaxLength(11)] public Double phone { get; set; } }
  • 24. http://code.msdn.microsoft.com/windowsapps/Sqlite-For-Windows-8-Metro-2ec7a882 Insert Data var dbpath = Path.Combine(Windows.Storage.ApplicationData.Current.LocalFolder.Path, "data.db3"); using (var db = new SQLite.SQLiteConnection(dbpath)) { // Create the tables if they don't exist db.Insert(new person() { name = txt1.Text.ToString(), address = txt2.Text.ToString(), phone = Convert.ToDouble(txt3.Text.ToString()), } ); db.Commit(); db.Dispose(); db.Close(); var line = new MessageDialog("Records Inserted"); await line.ShowAsync(); }
  • 25. http://code.msdn.microsoft.com/windowsapps/Sqlite-For-Windows-8-Metro-2ec7a882 Select Data var dbpath = Path.Combine(Windows.Storage.ApplicationData.Current.LocalFolder.Path, "data.db3"); using (var db = new SQLite.SQLiteConnection(dbpath)) { var d = from x in db.Table<person>() select x; list1.Items.Clear(); foreach (var sd in d) { list1.Items.Add(sd.name.ToString()); //list1.Items.Add(sd.address.ToString()); //list1.Items.Add(sd.phone.ToString()); } db.Dispose(); db.Close(); } var line = new MessageDialog("All Records Listed"); await line.ShowAsync();
  • 26. http://code.msdn.microsoft.com/windowsapps/Sqlite-For-Windows-8-Metro-2ec7a882 Delete Data var dbpath = Path.Combine(Windows.Storage.ApplicationData.Current.LocalFolder.Path, "data.db3"); using (var db = new SQLite.SQLiteConnection(dbpath)) { db.Delete<person>(list1.SelectedItem.ToString()); var d = from x in db.Table<person>() select x; list1.Items.Clear(); foreach (var sd in d) { list1.Items.Add(sd.name.ToString()); //list1.Items.Add(sd.address.ToString()); //list1.Items.Add(sd.phone.ToString()); } db.Dispose(); db.Close(); } var line = new MessageDialog("Selected Item Deleted"); await line.ShowAsync();