APP-A-THON

50 %
50 %
Information about APP-A-THON
Technology

Published on March 13, 2014

Author: Othaimeen

Source: slideshare.net

APP-A-THON Dima AlOthaimeen @othaimeen www.othaimeen.com

5:00 – 6:00 Designing great apps 6:00 – 6:30 Formatting groups and brainstorming ideas. 6:30 – 9:00 Developing apps with XAML and C# Agenda

#AppathonMS

Less is More

Find a recipe I want to make Prepare a recipe Share recipes with my friends

Find a recipe I want to make Prepare a recipe Share recipes with my friends

Layout

Store / Reading List / Alarms / Photos

Colors Apply the primary color associated with your brand. Graphics You can use graphics to reinforce your brand by adding character to the presentation of content in your app. The use of graphics should be used sparingly in your app design. Images Because most established brands have a defined color palette and typeface, they also use a specific style of imagery. Grid The grid aligns your branded app's UX to work with the rest of Windows. Layout The layout of each and every one of your app’s pages need to be relevant to your brand. Logo Use a logo in your Windows Store app to facilitate quick identification of your app. Typography The right choice can be as impactful to your brand as color, logo, or layout.

Windows Phone Windows Phone App Studio Link

Windows 8 Microsoft Project Siena Link

A new UI where touch is a first-class citizen along with full mouse-and-keyboard support Windows Store Apps

Rich, integrated search driven by Bing Personalized start and lock screens New live tile sizes, including large Live tile on install Apps share the screen Deep OneDrive integration

Windows 8.1: Free for all Windows 8 PCs

There are over 100,000 apps in the Windows Store including top apps like Hulu, Netflix, Twitter and Facebook.

New Windows Store UX Find apps on Start screen with search or new all apps view Custom app recommendations based on user behavior Tight integration with Bing search to aid app discovery Improved marketing alignment and focus on credit card attach

HTML/JS enables you to use your web development knowledge and great open source and commercial libraries to create native Windows Store apps.

XAML with C#, VB and C++ makes the best use of your wealth of desktop, server, and phone development knowledge to enable you to build compelling Windows Store apps.

Many core Windows 8.1 experiences built on the same technology New search, contact card, device companion apps, lock screen camera, and more

DirectX is the best platform for high- performance, high-frame rate games and visualizations

Programming skills Development tools Languages, frameworks Components Runtimes

Great device experiences … … powered by services in the cloud

XAML UI Controls

FrameworkElement TextBlock RichTextBlock Control ContentControl Border ButtonBase Button ToggleButton CheckBox RadioButton ProgressRing RangeBase ProgressBar TextBox, PasswordBox RichEditBox Image Shape Rectangle, Ellipse

TextBlock TextBlock FontSize="40" FontWeight="Bold" FontStyle="Italic" FontFamily="Times New Roman" TextBlock TextTrimming="WordEllipsis" TextBlock Typography.Fraction="Slashed" TextBlock Typography.StylisticSet4="True" TextBlock Typography.StylisticSet5="True" TextBlock Typography.StylisticSet6="True" TextBlock Typography.StylisticSet7="True"

RichTextBlock OverflowContentTarget="{Binding ElementName=SecondColumnOverflow}" Paragraph Paragraph Paragraph Hyperlink Hyperlink Paragraph Paragraph InlineUIContainer Button InlineUIContainer Run Run Paragraph Paragraph Run Paragraph RichTextBlock RichTextBlockOverflow x:Name="SecondColumnOverflow"

TextBlock ProgressRing IsActive="True" TextBlock ProgressBar Minimum="0" Maximum="250" Value="50" TextBlock ProgressBar IsIndeterminate="True" Important! You must deactivate progress rings and progress bars when not visible. There’s a performance penalty if you do not.

<TextBox Text="Hello world" /> <TextBox Text="Headers can be templated" Header="TextBox Header Text"/> <TextBox Text="I am going to the store for moar bread." Header="Spell-checking" IsSpellCheckEnabled="True"/> <TextBox Header="Placeholder text" PlaceholderText="please enter your first name"/> <TextBox Header="Color Font Support" Text="I like tapioca. &#x1F600;" IsColorFontEnabled="True" FontFamily="Segoe UI Emoji" /> <TextBox Text="For on-screen keyboards only" Header="Text Prediction" IsTextPredictionEnabled="True"/> <TextBox Text="pete@contoso.com" Header="Input scope control" PlaceholderText="For touch keyboard" InputScope="EmailSmtpAddress"/> <TextBox Text="Peter piper picked a peck" Header="Selection highlight color control" SelectionHighlightColor="Orange"/> <PasswordBox Header="Please enter your password" FontSize="40" Margin="20" IsPasswordRevealButtonEnabled="True" Password="Password1" />

<TextBox InputScope="EmailSmtpAddress"/> <TextBox InputScope="Formula"/> <TextBox InputScope="Number"/>

Button Click="LoadFileButton_Click" RichEditBox x:Name="RichTextEditor" private async void LoadFileButton_Click(object var new var await var await RichTextEditor.Document.LoadFromStream(TextSetOptions.FormatRtf, stream);

DatePicker CalendarIdentifier="GregorianCalendar" DatePicker CalendarIdentifier="KoreanCalendar" DatePicker CalendarIdentifier="JulianCalendar" DatePicker DayFormat="{}{dayofweek.solo.full}" DatePicker DayFormat="{}{day.integer} {dayofweek.abbreviated}" TimePicker ClockIdentifier="12HourClock" TimePicker ClockIdentifier="24HourClock" DatePickerTimePicker

A short sidebar, before we continue with controls

LocalBinding TextBlock Text="Set locally" TextBlock Text="{Binding FirstName}" person.FirstName Most control properties in XAML are dependency properties and can therefore be set in several different ways. Not shown here: animation (storyboards) and style setters Code

ButtonContent Button Button Button Grid Grid.ColumnDefinitions ColumnDefinition ColumnDefinition Grid.ColumnDefinitions Image StackPanel TextBlock TextBlock StackPanel Grid Button HyperlinkButton <Image Source="ms-appx:///Assets/Surface2.jpg"

XAMLCode-Behind Button Click="SimpleButton_Click" private async void SimpleButton_Click var new await The click event provides a simple way to handle button interaction directly from the code-behind. Double-click the button on the designer or use Intellisense in the XAML editor to generate the handler. Handlers may also be wired up from code using the += syntax in C# and equivalent in VB.

Button <Button.Flyout> <Flyout> StackPanel TextBlock TextBlock Button StackPanel </Flyout> </Button.Flyout> Button Button <Button.Flyout> <MenuFlyout> MenuFlyoutItem MenuFlyoutItem MenuFlyoutSeparator ToggleMenuFlyoutItem ToggleMenuFlyoutItem </MenuFlyout> </Button.Flyout> Button

{x:Null}

Ellipse Rectangle Rectangle Line Path

Border TextBlock Border Border is a ContentControl Although sometimes used to create rectangles, it’s very heavy for something which could be more efficiently accomplished with a shape. Use Border when you need a way to contain an element with a visible border.

TextBlock Image Scale at decode time Providing a size when loading saves memory as only the bits to be displayed are loaded in memory, reducing your app’s working set. Often, this results in higher quality scaling as well.

Add a comment

Related presentations

Presentación que realice en el Evento Nacional de Gobierno Abierto, realizado los ...

In this presentation we will describe our experience developing with a highly dyna...

Presentation to the LITA Forum 7th November 2014 Albuquerque, NM

Un recorrido por los cambios que nos generará el wearabletech en el futuro

Um paralelo entre as novidades & mercado em Wearable Computing e Tecnologias Assis...

Microsoft finally joins the smartwatch and fitness tracker game by introducing the...

Related pages

App-a-thon in a Box – precisionFDA

PrecisionFDA App-a-thon in a Box Help advance regulatory science, promote and discover NGS software, and contribute to the growing precisionFDA ...
Read more

App-a-thon – ACP National College Journalism Convention

$60 per person. Students and advisers welcome. Registration opening soon. Invest a day and come away with a working prototype of a mobile app for your news ...
Read more

BCS App-a-thon - Guinness World Records Challenge | BCS ...

BCS app-a-thon challenge at Google Campus, London . Having trouble view the video? Watch the video here. London Venues. BCS London ; Google Campus London
Read more

App-a-thon – Tanzim Saqib - blogs.msdn.microsoft.com

Terms and Conditions for the Online Universal Windows App-a-thon IMPORTANT: PLEASE READ THESE TERMS AND CONDITIONS (THE “TERMS AND CONDITIONS”) BEFORE ...
Read more

EMPOWER2016

Agenda. The easiest way to see what EMPOWER2016 has to offer, including details on our Pre-Conference Day and 1st ever QuickBase App-a-thon*! Details
Read more

Inno-thon | App-a-thon - Tata Power - DDL

Tata Power Delhi Distribution Ltd. and India Smart Grid Forum present INNO-THON and APP-A-THON, where you can prototype your ideas and win exciting prizes
Read more

App-a-thon* + Registration | EMPOWER2016

Arrive prior to the start of the full conference and attend the 1st ever App-a-thon, a day long competition that will challenge builders of all levels.
Read more

Aberystwyth University - App-a-thon

App-a-thon Guinness World Record Attempt. Aberystwyth University will be taking part in the App-a-thon Guinness World Record attempt, in partnership with ...
Read more

APP-A-THON - GTBIT - New Delhi - pinvents.com

Skilltrix Presents "Appathon" at GTBIT on 12th and 13th April , 2014 from 8 am to 6pm on both days . Build applications for Mobile and Web domain and enjoy ...
Read more

Support the 2014-15 College Summit App-a-thons

10 Cities Support the 2014-15 College Summit App-a-thons WHAT IS AN APP-A-THON? College Summit unleashes the power of low-income high school students
Read more