Kezdeti lépések

Helló,

Egy kis emlékeztető: Célok

Tehát, ahhoz hogy wondow 8 alatt fejlesszünk ’windows store app’ stílusú alkalmazásokat a következő dolgokra lesz szükségünk:

Windows 8

Visual studio 2012 for win8.

Ha ezek telepítésével megvagyunk kezdőthet is a fejlesztés :).

Nyissuk meg a vs2012-őt és hozzunk létre egy új projektet(FILE->new->project), ezután a  templates-ek küzül válasszuk a JavaScript-et itt pedig a Blank App, állítsuk be a projekt helyét és nevezzük el majd ok. Ha minden jól megy létre is jött a projektünk.

A projekt solution-ében a főbb dolgok a következők:

References (windows library for JavaScript)

css mappa: kezdetben a defaultl.css-t tartalmazza, ide menthetjük a különböző css fájljainkat.

images mappa:  kezdetben itt a programunkban talalható kepek vannak például az alkalmazás indulásánál mi jelenjen meg stb. Ezek a fájlok felül írásával könnyedén cseréljetjük ezeket(érdemes odafigyelni hogy azonos felbontású és méretű képekkel írjuk felól a meglévőket)

js mappa: kezdetben a default.js-t tartalmazza ez fogja indítani az alkalmazásunkat

default.html: (fentebb láthtjuk a tartalmát),A WinJS references részt érdemes minden html oldlunkba bemásolni a References részeit „incloudolja”, itt állíthatjuk monjuk az alkalmazásunk stílusát sötétre vagy világosra az „ui-dark.css”, vagy „ui-light.css” segítségével. Ez után saját referenciáinkat is hozzáadjuk jelen esetben a default.css-t és default.js-t.

Ha mindennel megvagyunk futtasuk a programot, ha még nincs tabletünk (ami jelenleg elég valószínű) akkor két lehetőségünk van a futtatásra, futtathatjuk a saját gépünkön(local machine) vagy szimulátoron (Simulator).

Ha elindítottuk az alkalmazásunkat a következő fog megjelenni: „Content goes here”, ez van a html fájlunk body-jában.

Nos egyenlőre ennyi hamarosan folyt. köv.

Üdv.: Balázs

Silverlight – Animációk

Silverlight animációk létrehozásának egyik legegyszerűbb módja a blend segítségével lehetséges. A blend erőssége az animációkban rejlik. Próba képpen megpróbálok animálni egy négyzetet, amely kék színből szürkévé váltzik. A négyzet kirajzolása viszonylag egyszerű feladat. Kitöltése is. Aki használt már Adobe Falsh-t annak nagyon ismerős kinézet, működés. Itt is megtalálható az idővonal, amelyben létrehozunk egy storyboardot. A z idővonalon beállíthatjuk az időkorlátokat valamint találhatunk az idővonal felett nyilakat amelyekkel elindíthatjuk az animációt, illetve ugrálhatunk a különböző storyboardok között.A feladatunk annyi volt scupán, hogy egy storyboard beszúrása után a négyzet színét olyan változtattam, amilyenre szerettem volna, helyben megtekintettem az eredményt és a szín sikeresen megváltozott. Ha sikerült megváltoztatni a színt, akkor próbálkozzunk meg mondjuk, hogy a négyzetből kört animáljon. Amennyiben ezzel is kész vagyunk próbáljunk olyan animációt létrehozni, amelyben gombbal indíthatjuk el az animációnkat. Hozzunk létre a button eszköz segítségével egy nyomógombot, melynek adjuk az “animáció indítása” nevet. Hozzunk létre egy ellipszis. Majd a timeline-on hozzunk létre storyboardot. 3-mat vagy akár többet is. Hozzunk létre egyet az 1ms-nél és húzzuk oda az ellipszis, majd a 2ms-hez is húzzuk oda.Elindítjuk az animációt láthatjuk ,hogy a kis ellipszisünk a megadott útvonalon mozog. Ekkor még semmi köze a gombhoz. Jelöljük ki a gombot, majd a kis villám ikonra kattintva előjön a gombhoz tartozó események megadása. Kattintsunk kétszer a Clickre. Előjön egy forráskód. Ennek a kódnak a “private void Button_Click(object sender, System.Windows.RoutedEventArgs e)” sora után írjuk be, hogy : sbAnim.Begin(); . Ezután, ha lefuttatjuk gombnyomásra indíthatjuk az animációnkat. A mai napba sajnos csak ennyi fért bele, de hamarosan újra jelentkezek!