Anatómia univerzálneho projektu pre Windows 8.1 a Windows Phone 8.1

Anatómia projektu

V okne Solution Explorer zistíte, že projekt univerzálnej aplikácie (solution) vlastne pozostáva z troch čiastkových projektov.

  • Windows projekt.
  • Windows Phone projekt.
  • Shared projekt.

Typ čiastkového projektu je v názve jeho zložky za bodkou, napríklad PrisadyPotraviny.WindowsPhone.

Projekt univerzálnej aplikácie vo Visual Studiu 2013.

Čiastkové projekty sú v samostatných zložkách.

Súbor App.xaml je spoločný pre obidve platformové projekty

<Application

x:Class=”PrisadyPotraviny.App”

xmlns=”http://schemas.microsoft.com/winfx/2006/xaml/presentation&#8221;

xmlns:x=”http://schemas.microsoft.com/winfx/2006/xaml&#8221;

xmlns:local=”using:PrisadyPotraviny” RequestedTheme=”Light”>

</Application>

Zaujímavý je atribút RequestedTheme, pomocou ktorého určíte motív pre Windows 8.1 – či bude zobrazený tmavý text na svetlom pozadí, alebo naopak

Rovnako spoločný je aj súbor App.xaml.cs je spoločný pre obidve platformové projekty. Sekcie kódu pre konkrétnu platformu sú riešené pomocou direktívy #ifdef a preddefinovaných konštánt WINDOWS_APP a WINDOWS_PHONE_APP

#if WINDOWS_PHONE_APP


#endif

 

#if WINDOWS_APP


#endif

Aby vývojové prostredie mohlo ponúkať interaktívnu nápoveď počas tvorby kódu – Intellisense, je potrebné nastaviť pre ktorú platformu momentálne píšete kód v súbore App.xaml.cs, prípadne v ďalších súboroch s kódom spoločných pre obidve platformy.

Výber platformy pre editor kódu a Intellisense

Spoločné pre obidva platformové zapuzdrené projekty sú aj zložky Assets, Common, DataModelStrings.

Grafika a multimédia v zložke Assets

Predovšetkým je potrebné rozlišovať zložku Assets umiestnenú v zložke <nazov projektu>.Shared a v zložkách projektov pre Windows 8.1 a Windows Phone 8.1.

Assets zložka v spoločnej sekcii obsahuje obrázky a iné multimediálne súbory, ktoré využíva aplikácia pre obidve platformy. Napríklad aplikácia s kuchárskymi receptami má v spoločnej zložke obrázky jedál a ingrediencie, ktoré zobrazuje tak aplikácia pre W8.1 ako aj pre WP8.1, aplikácia s testami pre autoškolu má v tejto zložke obrázky dopravných značiek a križovatiek…. Projekt univerzálnej aplikácie vytvorenej podľa šablóny HubApp má v tejto zložke obrázky DarkGray.png, MediumGray.png a LightGray.png, ktoré sa zobrazujú ako ilustračné obrázky položkám cvičných údajov

Zložky Assets vnorené v zložkách pre Windows 8.1 a Windows Phone 8.1, obsahujú platformovo závislú grafiku, teda obrázky dlaždíc, splash screen a podobne.

Projekt pre Windows 8.1 vytvorený podľa šablóny HubApp obsahuje v zložke pre Windows 8.1 súbory

  • Logo.scale-100.png (150 x 150 pixelov),
  • SmallLogo.scale-100.png (30 x 30 pixelov),
  • StoreLogo.scale-100.png (50 x 50 pixelov),
  • WideLogo.scale-100.png (150 x 150 pixelov),
  • SplashScreen.scale-100.png (620 x 300 pixelov.

Aby sa aplikácia dokázala prispôsobiť rôznym rozmerom a rozlíšeniam môžu byť obrázky v zložke Assets v rôznych veľkostiach, ktorých mierka je vyjadrená percentuálne. Môžete použiť obrázky v mierke 80, 100, 140 a 180 percent základného rozmeru.

Projekt pre Windows Phone 8.1 obsahuje v zložke Assets dva súbory s obrázkami pozadia

  • HubBackground.theme-dark.png
  • HubBackground.theme-light.png

a súbory s grafikou dlaždíc

  • Logo.scale240.png
  • SmallLogo.scale240.png
  • SplashScreen.scale240.png
  • Square71x71Logo.scale240.png
  • StoreLogo.scale240.png
  • WideLogo.scale240.png

Zložka Common

Zložka obsahuje základné triedy potrebné pre fungovanie aplikácie, napríklad NavigationHelper.cs, ObservableDictionary.cs, RelayCommand a SuspensionManager.cs.

Zložka Strings

V zložke Strings sú definície textových reťazcov spoločné pre obidva projekty. Definície sú v súboroch Resources.resw. Tieto súbory sú v zložkách podľa jazykovej lokalizácie. Po vytvorení projektu je vytvorená zložka en-US pre angličtinu a región USA.

Dôrazne odporúčame vytvárať definície textov v resourceoch. Uľahčí to nielen lokalizáciu ale aj úpravy aplikácie. Zmenou textu v spoločnom definičnom súbore sa automaticky zmení text v obidvoch projektoch ktoré ho využívajú.

V našej aplikácii pre jednoduchosť nebudeme vytvárať českú a slovenskú lokalizáciu. Preto zmeňte názov aplikácie priamo v súbore umiestnenom v zložke en-US.

Reťazce v resourceoch môžete komfortne editovať pomocou integrovaného editora

Spoločný dátový model.

V adresári DataModel nájdete súbor SampleData.json, v ktorom sú uložené statické cvičné údaje, ktoré aplikácia využíva na demonštráciu možností zobrazovania dátových štruktúr. Údaje sú vo formáte JSON (JavaScript Object Notation), ktorý využíva veľa webových služieb poskytujúcich údaje pre aplikácie. JSON údaje sú prehľadne štruktúrované, takže sú dobre čitateľné počítač aj človeka. Údaje vo formáte JSON môžu obsahovať atribúty typu String, Boolean, Array, Object, Number a Null

Ukážka údajov v súbore SampleData.json po vytvorení projektu typu Hub App

{“Groups”:[

{

“UniqueId”: “Group-1”,

“Title”: “Group Title: 1”,

“Subtitle”: “Group subtitle: 1”,

“ImagePath”: “Assets/DarkGray.png”,

“Description” : “Group Description: Lorem ipsum dolor sit amet…”,

“Items”:

[

{

“UniqueId”: “Group-1-Item-1”,

“Title”: “Item Title: 1”,

“Subtitle”: “Item Subtitle: 1”,

“ImagePath”: “Assets/LightGray.png”,

“Description” : “Item Description: Pellentesque porta, mauris …”,

“Content” : “Curabitur class aliquam ..”

},

 

Atribút ImagePath odkazuje na obrázky priradené k jednotlivým záznamom. Obrázky sú uložené v adresári Assets

Naša aplikácia, ktorú budujete nad šablónou projektu Hub App môže podobne ako šablóna využívať statické údaje, alebo môžete aplikáciu pripojiť ku zdroju údajov na webe. Naša aplikácia bude pre jednoduchosť využívať statický zoznam prísad. Ocenia to aj používatelia, nakoľko aplikácia bude fungovať aj v režime off line bez pripojenia na internet. Nové prísady sa samozrejme sporadicky objavia, takže aplikáciu bude potrebné niekoľko krát do roka aktualizovať formou upgrade.

Dátový model v súbore SampleDataSource.cs po vytvorení projektu obsahuje dve triedy pre prístup aplikácie k údajom s hierarchickou štruktúrou

public class SampleDataItem

{

}

 

public class SampleDataGroup

{

}

 

Trieda SampleDataSource vytvára kolekciu skupín položiek buď s pevne daným statickým obsahom, alebo dynamickými údajmi.

Údaje sú po načítaní umiestnené v objektoch typu ObservableCollection

private ObservableCollection<SampleDataGroup> _groups =

new ObservableCollection<SampleDataGroup>();

 

public ObservableCollection<SampleDataGroup> Groups

{

get { return this._groups; }

}

 

Aplikácia Prísady potravín bude pracovať s údajmi v tvare

{“Groups”:[

{

“UniqueId”: “Group-4”,

“Title”: “Group Title: 4”,

“Items”:

[

{“Kód”: “E100″,”Názov”: “Kurkumin”,”Škodlivosť”: “1”},

{“Kód”: “E101″,”Názov”: “Riboflavin”,”Škodlivosť”: “1”},


Použili sme súbor SampleData.json. Aby sme mali s úpravou šablóny, čo najmenej práce, ponechali sme aj hierarchickú štruktúru, v našom prípade sú údaje začlenené do jedinej skupiny s názvom Group-4, nakoľko práve táto skupina sa zobrazuje v Sekcii 3.

Povzbudzujeme vás, aby ste si vytvorili aplikáciu so svojim vlastným námetom a svojími vlastnými údajmi.

Trieda SampleDataItem obsahuje atribúty položiek pre jednotlivé záznamy, v tomto prípade údaje o jednotlivých prísadách. Aby sme vám uľahčili orientáciu pri adaptovaní vzorového dátového modelu, ponechali sme aj názvy jeho tried. Atribúty UniqueID (Kód), Title (Názov), a Skodlivosť (Škodlivosť) budú načítané z JSON súboru. Atribúty Farba a Bublina budú doplnené počas načítavania údajov. Pomocou farby sa indikuje škodlivosť prísady a atribút Bublina obsahuje text bublinovej nápovede (Too tip)

public class SampleDataItem

{

public SampleDataItem(String uniqueId, String title, String skodlivost, String

Farba, String bublina)

{

this.UniqueId = uniqueId; //kod

this.Title = title; //Nazov

this.Skodlivost = skodlivost; //Skodlivost

this.Farba = Farba;

this.Bublina = bublina;

}

 

public string UniqueId { get; private set; }

public string Title { get; private set; }

public string Skodlivost { get; private set; }

public string Farba { get; private set; }

public string Bublina { get; private set; }

 

 

public override string ToString()

{

return this.Title;

}

}

 

Trieda SampleDataGroup obsahuje údaje o skupinách, či kategóriách objektov. V tomto príklade sa využíva iba jediná skupina. Hierarchickú štruktúru sme ponechali pre vašu lepšiu orientáciu pri adaptovaní šablóny projektu.

public class SampleDataGroup

{

public SampleDataGroup(String uniqueId, String title)

{

this.UniqueId = uniqueId;

this.Title = title;

this.Items = new ObservableCollection<SampleDataItem>();

}

 

public string UniqueId { get; private set; }

public string Title { get; private set; }

public ObservableCollection<SampleDataItem> Items { get; private set; }

 

public override string ToString()

{

return this.Title;

}

}

 

Trieda SampleDataSource zapuzdrujúca kolekciu skupín položiek v metóde GetSampleDataAsync obsahuje aj kód pre predspracovanie údajov. Doplní atribúty Farba a Bublina.

private async Task GetSampleDataAsync()

{

String sKod = “”, sNazov = “”, sSkodlivost = “”, sFarba = “Gray”, sBublina = “”, sSkod = “”;

 

if (this._groups.Count != 0) return;

 

Uri dataUri = new Uri(“ms-appx:///DataModel/SampleData.json”);

 

StorageFile file = await StorageFile.GetFileFromApplicationUriAsync(dataUri);

string jsonText = await FileIO.ReadTextAsync(file);

JsonObject jsonObject = JsonObject.Parse(jsonText);

JsonArray jsonArray = jsonObject[“Groups”].GetArray();

 

foreach (JsonValue groupValue in jsonArray)

{

JsonObject groupObject = groupValue.GetObject();

SampleDataGroup group = new SampleDataGroup(groupObject[“UniqueId”].GetString(),

groupObject[“Title”].GetString());

 

foreach (JsonValue itemValue in groupObject[“Items”].GetArray())

{

JsonObject itemObject = itemValue.GetObject();

sKod = itemObject[“Kód”].GetString();

sNazov = itemObject[“Názov”].GetString();

sSkodlivost = itemObject[“Škodlivosť”].GetString();

 

//farba podla skodlivosti

switch (sSkodlivost)

{

case “0”: sFarba = “LimeGreen”; sSkod = “Prírodná látka”; break;


case “7”: sFarba = “Red”; sSkod = “Nebezpečná prísada”; break;

default: break;

}

 

sBublina = sKod + “: ” + sNazov + ” – ” + sSkod;

 

group.Items.Add(new SampleDataItem(sKod, sNazov, sSkod, sFarba, sBublina));

}

this.Groups.Add(group);

}

}

 

Ak by ste vytvárali aplikáciu, ktorá zobrazuje údaje získané vo formáte JSON z webu, použili by ste v metóde GetSampleDataAsync kód

string sJSON;

var clientk = new HttpClient(); //kategorie

clientk.MaxResponseContentBufferSize = 1024 * 1024;

var response = await clientk.GetAsync(new Uri(“http…”));

var result = await response.Content.ReadAsStringAsync();

sJSON = result.Substring(0, result.Length);

var jsonZoznam = JsonArray.Parse(sJSON);

Reklamy

Pridaj komentár

Zadajte svoje údaje, alebo kliknite na ikonu pre prihlásenie:

WordPress.com Logo

Na komentovanie používate váš WordPress.com účet. Odhlásiť sa / Zmeniť )

Twitter picture

Na komentovanie používate váš Twitter účet. Odhlásiť sa / Zmeniť )

Facebook photo

Na komentovanie používate váš Facebook účet. Odhlásiť sa / Zmeniť )

Google+ photo

Na komentovanie používate váš Google+ účet. Odhlásiť sa / Zmeniť )

Connecting to %s


%d bloggers like this: