Kako napraviti program za Windows. App Studio - nova verzija mrežnog dizajnera aplikacija tvrtke Microsoft

💖 Sviđa li vam se? Podijelite vezu sa svojim prijateljima
0

Bok svima!

Predstavljam vam novi Microsoftov alat "Windows App Studio"- dizajner za izradu aplikacija. Danas ću vam reći kako prosječnom korisniku postalo je moguće stvarati aplikacije za Windows i Windows Phone. I malo o tome kako ovaj alat može biti koristan programeru.

App Studio je alat dizajniran za izradu aplikacija sadržaja. Ova vrsta aplikacije korisniku pruža aktualne informacije, razne kataloge i čitav niz drugih standardnih funkcija.

App Studio komunicira s korisnikom putem web sučelja, radi na bilo kojem pregledniku i dostupan je na sljedećoj poveznici. Svi podaci App Studija pohranjuju se u oblaku.

Za pristup App Studiju morate imati Microsoftov račun (bivši Live ID) i pristup Internetu.

Pregled
Sučelje je jednostavno i intuitivno:


Na početna stranica Postoji upravljačka ploča za pristup glavnim stranicama resursa:



Glavna stranica također prikazuje aplikacije izrađene u App Studiju, koje funkcioniraju i dostupne su u Windows Storeu:


Predlošci
Za izradu aplikacije App studio nudi sljedeće scenarije:
  • Koristite predloške;
  • Napravite aplikaciju od nule.
App Studio predlošci su tematski orijentirane aplikacije s gotovom strukturom, demo sadržajem i mogućnostima uređivanja:


Za razliku od drugih predložaka, Empty App ne nudi nikakvu skriptu za izradu aplikacija i potpuno je bez sadržaja.

Svi App Studio predlošci pružaju mogućnost stvaranja univerzalnih aplikacija dostupnih na Windows i Windows Phone 8.1 uređajima. Uz predložak web aplikacije:

Svrha ovog predloška je prerada mobilna verzija web-mjesta u web-aplikaciju pomoću URL-a web-mjesta. Ova je značajka dostupna samo za Windows Telefonske aplikacije.

Vrijedi napomenuti raznolikost App Studio predložaka i prisutnost tematskih komponenti u svakom od njih:


Izrada aplikacije
Ciklus izrade aplikacije u App Studiju sastoji se od 4 faze:
  • Potražite ideju;
  • Sadržaj punjenja;
  • Dizajn stila;
  • Korištenje gotove aplikacije;
Kako bismo demonstrirali mogućnosti alata, izradit ćemo Wine Catalog temeljen na Empty App. Nazovimo ga Wine Expert, počnimo stvarati strukturu i dodavati sadržaj.

Početna stranica za novu Praznu aplikaciju izgleda ovako:


Radni prostor podijeljen je u četiri dijela:

  • Poraditi na strukturi i sadržaju aplikacije: Sadržaj;
  • Sljedeće dvije kartice su odgovorne za izgled i stil primjene: Teme I Pločice.
  • Objavite informacije sadrži preliminarne postavke za objavljivanje aplikacije u Windows trgovini.
Rad na sadržaju
U području sadržaja određujemo koje će se stranice Wine Expert sastojati od:
  • O vinu;
  • Katalog vina;
  • Proizvodnja vina;
  • O kreatorima.
Za izradu strukture koristimo skup blokova koje je predložio App Studio:



Dizajn i stil aplikacije


App studio na kartici Teme nudi konfiguraciju teme aplikacije:

  • Standardno: tamna, svijetla pozadina;
  • Korisnik preferira pozadinu, uključujući opciju postavljanja slike kao "pozadinske slike".
Koristeći prilagođeni stil, također možete prilagoditi boju teksta i standardnu ​​traku aplikacije aplikacije:


Kartica Tiles označava izgled aplikacije na početnom zaslonu, pozadinska slika i pozadinski čuvar zaslona:


Postavimo pločicu aplikacije na početni zaslon:

  • Flip predložak– žive pločice;
  • Predložak ciklusa– listanje kroz navedenu kolekciju iz aplikacije;
  • Ikonski predložak– jedna slika sve tri veličine pločica.
Za katalog vina odaberite Flip predložak i prenesite potrebne slike koje odgovaraju navedenim veličinama:


U lijevoj gornji kut Postoji i područje za učitavanje slike, koje će biti prikazano pored naziva aplikacije, popunimo i njega:

Na kartici Splash&Lock izvršit ćemo iste radnje sa slikama:


Spremite promjene i prijeđite na sljedeći korak.

Postavljanje aplikacije za objavljivanje u Windows trgovini
Pogledajmo koje podatke od nas zahtijeva "Objavi informacije" za pripremu za objavljivanje aplikacije u Windows Storeu, osim razumljivog naslova aplikacije, opisa aplikacije i jezika:




Jedan od uvjeta za objavu aplikacije u Windows Storeu je da naziv aplikacije (App Name) bude rezerviran u trgovini prije objave. Ime aplikacije rezerviramo u Razvojnom centru. Trgovina će svakom rezerviranom (registriranom) nazivu dodijeliti vlastiti "Identitet paketa". Korisnik App Studija mora znati ove informacije, ime i ID.

Kako bi App Studio generirao poseban paket aplikacije za objavu, morate ispuniti “Manifest aplikacije” - manifest aplikacije. Da biste to učinili, sljedeća postavka "Poveži aplikaciju s trgovinom" dostupna je u "Objavi informacije":

Završna faza rada s aplikacijom
Aplikacija je spremna - kliknite "Završi":


Dobivamo mogućnost pregleda aplikacije za bilo koji uređaj.

Funkcija “Generiraj” predlaže odabir za koju platformu želite generirati aplikaciju, odaberite Windows Phone 8.1 i Windows 8.1, što će vam omogućiti stvaranje nove vrste aplikacije - univerzalni:


U polju "Vrsta generiranja" napominjemo da nam je potreban paket aplikacije za instalaciju na uređaj i paket za objavu. Izvorni kod aplikacije generira se prema zadanim postavkama.


Dakle, sada možemo preuzeti sve materijale koje nudi App Studio za rad s kreiranom aplikacijom.

Instaliranje aplikacije na vaš uređaj
Aplikacija stvorena pomoću App Studija može se instalirati na uređaj izravno, izvan Windows Storea, zahvaljujući generiranim “Paketima koji se mogu instalirati”.

Što je potrebno za ovo:

  1. Instalirajte certifikat na uređaj:
    • Preuzmite instalacijski paket koji se nalazi u App Studiju za certifikat ovisno o uređaju (PC, tablet, telefon);
    • Pokrenite datoteku s ekstenzijom .cer (prilikom instalacije odaberite Lokalno računalo, Postavite sve certifikate u sljedeću pohranu: Pouzdana glavna tijela za certifikaciju).
  2. Instalirajte aplikaciju na svoj uređaj:
    • Preuzimanje instalacijskih paketa;
    • Pronađite datoteku Add-AppDevPackage1.ps1, kliknite desnom tipkom miša i pokrenite “Run with PowerShell”.


Pristupite podacima aplikacije u oblaku
Da biste dodali, izbrisali ili uredili dinamičke podatke za objavljenu aplikaciju, trebate otići do odgovarajuće aplikacije na popisu nadzorne ploče u razvojnom centru. Otvorite zbirku i napravite sve potrebne izmjene. Aplikacija će se ažurirati automatski.
Značajke programera
App Studio može biti koristan za profesionalnog programera pružanjem izvornog koda aplikacije.

Programeru također može biti zgodno da kreira strukturu svoje aplikacije pomoću ovog alata, a zatim upotrijebi Visual Studio 2013 (Ažuriranje 2) da je poboljša bez gubljenja vremena na pisanje osnovnih elemenata.

Zaključak
Za izradu aplikacije u App Studiju nije potrebno nikakvo programersko znanje, osim izrade i primanja aplikacije izvorni kod potpuno besplatno.

Programeri će također biti zainteresirani za korištenje novog alata, na primjer, za smanjenje vremena za razvoj osnovne strukture aplikacije.

Stvaranje aplikacije Visual Studio s prozorima

Uvod u stvaranje aplikacija s prozorima

API funkcije za rad s konzolom

Struktura prozorske aplikacije

Kontrole prozora

Grafika u prozorskim aplikacijama

U operacijskom sustavu Windows moguće su 3 vrste programskih struktura:

  • dijalog (glavni prozor - dijalog),
  • konzolna struktura ili struktura bez prozora,
  • klasična (prozor, okvir) struktura

Razgovorne aplikacije za Windows imaju minimalno korisničko sučelje i prenose informacije korisniku kroz standardne dijaloške okvire (na primjer, okvir za poruke MessageBox(). Program radi "na slijepo".

Aplikacije bez prozora (konzole). je program koji radi u tekstualnom modu. Rad konzolne aplikacije nalikuje radu MS-DOS programa. Ali ovo je samo vanjski dojam. Konzolna aplikacija opremljena je posebnim Windows funkcije. Konzolne aplikacije su sustav sredstava za interakciju korisnika s računalom, koji se temelji na korištenju tekstualnog (alfanumeričkog) načina prikaza ili sličnog (MS-DOS naredbeni redak, Far). Konzolne aplikacije su vrlo kompaktne, ne samo u kompajliranom obliku, već iu tekstualnom obliku, te imaju istu mogućnost pristupa resursima sustava Windows putem API funkcija kao prozorske aplikacije.

Prozorske (okvirne) aplikacije izgrađeni su na temelju posebnog skupa API funkcija koje čine grafičko korisničko sučelje (GUI, Graphic User Interface). Glavni element takve aplikacije je prozor. Prozor može sadržavati kontrolne elemente: gumbe, popise, prozore za uređivanje itd. Ti su elementi, zapravo, također prozori, ali s posebnim svojstvima. Događaji koji se dogode s tim elementima (i samim prozorom) rezultiraju slanjem poruka prozorskoj proceduri.

Razlika između prozorskih i konzolnih Windows aplikacija je s kojom vrstom informacija rade.

U dijaloškom okviru New Project Visual Studio odaberite Visual C#, Silverlight za Windows Phone i jednostavan predložak Windows Phone aplikacije i nazovite ga ExploringXAMLFeatures.


U dijaloškom okviru za odabir cilja operacijski sustav odaberite Windows Phone OS 7.1


Nakon izrade projekta, prozor Visual Studio izgledat će ovako:


Pogledajmo strukturu projekta u prozoru Solution Explorera:

Naziv datoteke Svrha
AppManifest.xmlDatoteka manifesta potrebna za generiranje XAP datoteke u koju je upakirana aplikacija za implementaciju na telefonu.
AssemblyInfo.csJoš jedna konfiguracijska datoteka koja definira neke metapodatke glavnog sklopa aplikacije.
WMAppManifest.xmlDatoteka metapodataka koja sadrži različite postavke aplikacije: naslov, postavljanje prve stranice, putanje do ikona, definiranje potrebnih mogućnosti sustava itd.
App.xamlOvo je datoteka resursa aplikacije. Ovdje se nalaze globalni resursi (o tome će biti riječi kada se koriste stilovi) ili globalni događaji (koji se događaju prilikom pokretanja aplikacije). Ova je datoteka također ulazna točka aplikacije.
App.xaml.csDatoteka koda (kod iza) za App.xaml. Ovdje možete upravljati događajima i pogreškama na razini aplikacije, uključujući nadgrobni prikaz aplikacije. O ovom konceptu bit će riječi kasnije kada se bude govorilo o multitaskingu.
ApplicationIcon.pngSlika koja će biti ikona aplikacije na telefonu. Ovo je jako važna datoteka jer je prva stvar koju će korisnici vidjeti kada rade s aplikacijom.
Pozadina.pngOva se slika koristi kada je aplikacija prikvačena na početni zaslon telefona. Ovo je u biti velika ikona aplikacije. Ima smisla učiniti ga vizualno sličnim ApplicationIcon.png.
MainPage.xamlOvo je dio odabranog predloška aplikacije. MainPaige nije baš dobar naziv, ali to je ono što koristi zadani predložak projekta. Ova stranica predstavlja sučelje koje korisnik vidi prilikom pokretanja aplikacije.
MainPage.xaml.csMainPage.xaml kodna datoteka stranice.
SplashScreenImage.jpgOva slika se prikazuje dok se aplikacija učitava. Možete postaviti vlastitu sliku s animacijom koja vas obavještava da se aplikacija učitava. Postoji tehnika za stvaranje stranica s vrlo dinamičnim učitavanjem u XNA, ali ona je daleko izvan dosega ove serije članaka.

XAML datoteke definiraju sučelje aplikacije. Zapravo je jednostavno XML datoteke s XAML označnim jezikom.

Iako je ovo najjednostavniji projekt, on sadrži sve ključne elemente koje sadrže svi ostali predlošci i vrste projekata.

Imajte na umu da su neke od postavki predstavljene u obrascu konfiguracijske datoteke, mogu se uređivati ​​u vizualnom sučelju za uređivanje postavki aplikacije.

Dodavanje kontrola na XAML stranicu

Imajte na umu da Visual Studio prema zadanim postavkama renderira i dizajn i XAML stranice.

Ako ste otišli do drugih datoteka rješenja, dvaput kliknite datoteku MainPage.xaml.

U XAML kodu datoteke MainPage.xaml, unutar Grid elementa pod nazivom ContentPanel, umetnite kontrolu Button:

U prozoru dizajna, gumb će se pojaviti odmah otprilike u sredini sučelja. Obratite pažnju na atribut Ime? Ovo je jedinstveni identifikator elementa koji vam pomaže da ga referencirate u kodu. Zamislite ovo kao ID atribut kontrole. Dodajmo sada radnju kada se klikne na ovaj gumb. Postoje dva načina za vezanje događaja za gumb (ili bilo koju drugu kontrolu). U XAML-u, točno u definiciji gumba, možemo dodati atribut Click i InteliSense će automatski pitati želimo li generirati novi rukovatelj događajima:


Rukovatelja događajem možete vezati izravno u kodu stranice Home.xaml.cs bez navođenja u XAML datoteci:

Public MainPage() ( InitializeComponent(); MyButton.Click +=new RoutedEventHandler(MyButton_Click); )

Obje metode djeluju. Možete koristiti bilo koji od njih. Radi jednostavnosti, ovdje ćemo koristiti definiciju XAML metode. Sada možete pisati upravljani kod u funkciji MyButton_Click koja će promijeniti sučelje ili pozvati druge funkcije. Dovršimo naš primjer aplikacije dodavanjem koda koji će promijeniti tekst u TextBlock PageTitle (PageTitle je naziv, tako da ga možete referencirati izravno u kodu) u "hello wp7". Da biste to učinili, dodajte sljedeći kod u funkciju:

Private void MyButton_Click(object sender, RoutedEventArgs e) ( PageTitle.Text = "hello wp7"; )

Odaberite u postavkama projekta Windows uređaj Emulator

I pokrenite aplikaciju klikom na zeleni trokut ili tipku F5. Nakon pokretanja aplikacije i klika na gumb "Pritisni me", zaslon bi trebao izgledati slično slici ispod:

Dodavanje novih stranica u projekt

Samo se najjednostavnija aplikacija sastoji od jedne stranice. Želimo naučiti kako pisati složene aplikacije s više stranica. Možemo koristiti predloške Pivot, Panorama, možemo koristiti MVVM (Model-View-ViewModel) obrazac dizajna, a prvo ćemo naučiti kako dodati nove stranice u projekt i kretati se između njih.

U prozoru Solution Explorer kliknite desnom tipkom miša na naziv projekta i u izborniku koji se pojavi odaberite Dodaj, zatim Nova stavka, u dijaloškom okviru koji se otvori odaberite Windows Phone Portrait Page i nazovite je SecondPage.xaml:


Sada imamo praznu XAML stranicu, točnu kopiju stranice MainPage.xaml prije nego što smo je uredili.

Kako bismo bolje razlikovali stranice, idemo na XAML kod stranice SecondPage i uredimo element TextBlock s Name PageTitle Svojstvo teksta kao ispod:

Navigacija između stranica aplikacije

Dakle, imamo dvije stranice u projektu; kada se aplikacija pokrene, prikazuje se stranica MainPage.xaml. Kako sada mogu prijeći s MainPage.xaml na SecondPage.xaml?

Pokušajmo dva jednostavnih načina, kako to učiniti.

U XAML kodu datoteke MainPage.xaml nakon koda Buttona koji smo ranije dodali, dodajte kod HyperlinkButton kao što je prikazano u nastavku:

reci prijateljima
Cvrkut
Samsung igra...
Sljedeći članak
Pročitajte također
Najbolji glazbeni playeri za Android
Najbolji glazbeni playeri za Android
2024-03-13 00:03:49
Što je hub, switch i router?
Što je hub, switch i router?
2024-03-12 00:04:38
Json dekodiranje kratica
Json dekodiranje kratica
2024-03-11 00:04:21
jQuery galerija slika sa zanimljivim efektom
jQuery galerija slika sa zanimljivim efektom
2024-03-09 00:04:15