Iron Speed Designer 7.10 - przegląd funkcjonalności wygenrowanej aplikacji

Autorzy: Wojciech Ryczko


ASP.NET, Iron Speed, RAD


Iron Speed Designer 7.10 to potężne narzędzie do błyskawicznego tworzenia aplikacji webowych. Po wygenerowaniu aplikacji, możemy z początku czuć się trochę zagubieni, dlatego w tym artykule zajmiemy się przeglądem funkcjonalności wygenerowanej przez nas aplikacji, aby wszystko było jasne i przejrzyste.

Wstęp

W tym artykule zobaczymy jakie domyślne funkcjonalności oferuje Iron Speed Designer. Po utworzeniu/edycji projektu należy go uruchomić, więc skompilujemy sobie naszą aplikację i przeglądniemy co dostaliśmy "prosto z pudełka".

Kompilacja

Iron Speed generuje nam projekt aplikacji ASP.NET, dlatego aby uruchomić naszą aplikację musimy ją najpierw skompilować i "odpalić". W górnym panelu naszego Desinger'a widzimy zielony przycisk "Run", po kliknięciu którego Iron Speed skompiluje naszą aplikację, następnie uruchomi serwer ASP.NET, otworzy okno przeglądarki i wyświetli naszą aplikację. Do tej pory nie było tu żadnych nowości czy utrudnień, wszystko przebiega podobnie jak w znanych, standardowych IDE.2

Goodbye IDE! Welcome Browser!

Po dłuższej chwili widzimy naszą wygenerowaną aplikację. W naszym przypadku pierwsza strona pokazana na ekranie to tabelka z kategoriami produktów. Przejdziemy teraz przez zawartość i przeglądniemy poszczególne elementy. Na szczycie widzimy logo aplikacji, możemy je w bardzo prosty sposób zmienić na jakiekolwiek inne, w nagłówku Master Page. Na prawo od logo mamy kontrolkę "Sign In" wraz z loginem obecnego użytkownika, obecnie widzimy tylko ikonę drukowania, ponieważ nie określiliśmy użytkowników, ani ról. W tym miejscu będzie się również pojawiała lista języków, jeżeli zdecydujemy się na aplikację wielojęzyczną.3

Po lewej stronie widzimy "Menu", w naszym przykładzie jest ono pionowe - nic nie stoi na przeszkodzie, aby je zmienić na poziome lub mieć oba naraz. Iron Speed daje nam możliwość utworzenia wielopoziomowego, rozwijalnego "Menu" (na przykładzie) korzystając z JavaScript oraz menu statycznego, gdzie poszczególne elementy to po prostu przyciski lub linki do stron.

4

Na prawo od "Menu" mamy główną część naszej stronki. Na górze widzimy nagłówek określający tabelę, z której zostały pobrane dane dla danej strony. Oczywiście możemy zmieniać zarówno treść wiadomości, jak również czcionkę z poziomu naszego IDE. Małym dodatkiem jest przycisk zwijania i rozwijania "Colapse/Expand Button", który korzystając z metod JavaScript zwija i rozwija zwartość całej tabeli. Może teraz nie widzimy zalet tego rozwiązania, ale w momencie kiedy na stronie będzie dużo informacji pochodzących z kilku tabel bazy danych, taki przycisk może zwiększyć czytelność.

5

Poniżej mamy sekcję filtrów. Pierwszym filtrem jest "Search Box", w którym wpisujemy początkowy ciąg znaków interesującej nas kategorii produktów, a aplikacja zaproponuje nam pozycje zaczynające się od wskazanej frazy. Po kliknięciu na przycisk "OK", zawartość tabelki zostanie odpowiednio przefiltrowana. Niżej mamy następne dwa filtry reprezentujące - w naszym przypadku - listę nazw kategorii i artykułów. Po wybraniu elementu z listy, ponownie zawartość zostanie odpowiednio zmieniona.6

Zaraz pod panelem filtrów mamy sekcję przycisków funkcyjnych. Idąc od lewej, do prawej odkryjemy po kolei przeznaczenie poszczególnych elementów. Pierwszy to przycisk dodania nowego elementu, po kliknięciu którego zostaniemy przekierowani do strony, gdzie będziemy mogli uzupełnić informację o nowej pozycji. Następny przycisk pozwala nam na edycję zaznaczonych elementów. Kolejny przycisk pozwoli nam na skopiowanie zaznaczonego elementu. Kolejny na usunięcie. Następnie mamy kilka przycisków pozwalających na eksport danych znajdujących się w tabelce do dokumentów PDF, WORD, EXCEL, CSV. Ważnym napomnienia jest fakt, że wyeksportowana zostanie nie cała tabela, a tylko przefiltrowana zawartość. Dzięki czemu, jeżeli po wyborze kryteriów filtracji zechcemy wrzucić wynik do pliku PDF możemy być pewni, że zostaną tam zamieszczone tylko te dane które przefiltrowaliśmy. Następnym w kolejności jest przycisk importu danych, który uruchamia nam "Import Wizard", pozwalający nam pobrać dane z plików CSV czy Excel, a nawet baz danych (wymagana pełna zgodność struktury i rodzaju baz) takich jak Access, MySQL, SQL Server, Oracle i wprowadzić je bezpośrednio do naszej bazy danych. Kolejnym przyciskiem jest "Refresh", czyli po prostu odświeżenie strony - identycznie jak w przypadku przeglądarki. Następny przycisk resetuje nam filtry - ustawia na wartość startową - i pokazuje nieprzefiltrowaną zawartość tabelki. To całkiem przydatna funkcjonalność w przypadku kiedy mamy dużą liczbę filtrów. Zamiast na każdym wybierać np. "All", możemy w prosty sposób zautomatyzować ten proces klikając w "Reset filters".7

Na prawo od panelu przycisków funkcyjnych mamy sekcję z kontrolkami paginacji, a to pozwala nam prosto przemieszczać się przez wszystkie wiersze tabeli. I tak mamy "First page", który przenosi nas do pierwszej strony, "Previous" and "Next", które po prostu wyświetla następną i poprzednią stronę z zawartością naszej kolumny. Jeżeli chcemy przejść bezpośrednio do konkretnej strony możemy ją wpisać w pole pomiędzy wspomnianymi przyciskami. Dalej widzimy całkowitą liczbę elementów, którą zawiera nasza (przefiltrowana lub nie) tabela. Kolejne pole pozwala nam wpisać liczbę elementów wyświetlanych na pojedynczej stronie. Następnie mamy przycisk "OK", którym zatwierdzamy zamiany wprowadzone w polach paginacji.

8

Poniżej wszystkich opisanych przycisków mamy panel ze szczegółami (wierszami) naszej tabelki, a obok jeszcze więcej bardzo przydatnych przycisków. W pierwszej kolejności zajmiemy się nagłówkami kolumn. Jak widzimy niektóre z nich są wyświetlane jako hiperlinks, to pozwala nam - po kliknięciu - na sortowanie zawartości tabeli według wybranej kolumny. Mamy również możliwość zaznaczenia wszystkich pozycji na obecnej stronie klikając w pole umieszczone z lewej strony nagłówka tabelki. Może się to stać pomocne w sytuacji, gdy będziemy chcieli np. usunąć tylko te elementy, które widzimy obecnie.9

Spójrzmy teraz na szczegóły pojedynczego wiersza. Pierwsza ikona "Show record" przekieruje nas do szczegółów dotyczących danej pozycji - w naszym przypadku produktu. Natomiast ikona "Edit record" ukaże nam podobne informacje z tym wyjątkiem, że pozwoli nam edytować ich zawartość. Funkcjonalność "Copy record" omówiłem już wcześniej, pozwala ona dodać nowy rekord z domyślnymi parametrami co pierwowzór. Pod koniec mamy przycisk usuwający dany wiersz. Nareszcie doszliśmy do głównego panelu strony, czyli wierszy z danymi. Jak widzimy na przykładzie tabela nie musi się składać z samego tekstu. Wiersz może zawierać obrazki, linki do plików, a nawet kolejne tabele ("table in table").10

Przejdźmy teraz do przykładowej pozycji klikając na "Show record" - ikonka lupy - przy danym wierszu. Widzimy teraz, że na szczycie mamy szczegóły elementu - również może to być tekst, link, obrazek, tabelka. Ponownie mamy do dyspozycji przycisk zwiń i rozwiń pozwalający nam schować zawartość szczegółów naszej kategorii. Standardowo dostaliśmy również ikonkę "Edit" pozwalającą nam przenieść się w tryb edycji.

11

Poniżej informacji na temat naszej kategorii mamy kolejną tabelę. W naszym konkretnym przypadku mamy tabelę odzwierciedlającą listę produktów należących do danej kategorii. W języku programistów możemy tu mówić o "child data", czyli o danych powiązanymi relacjami. Jak w przypadku poprzedniej tabeli mamy tu do dyspozycji wszystkie wcześniej opisane kontrolki i przyciski. Jako ciekawostkę dodam, że obecna tabela jest prostą kontrolką, którą możemy przeciągnąć i upuścić w naszym IDE, nie musimy nic więcej programować, nasze narzędzie samo wykryje powiązania w naszej bazie danych.12

Przenieśmy się do następnej formatki. Klikając w ikonę "Edit" będziemy mogli edytować nasz element. Możemy tu zmieniać całą zawartość, każde pole korzystając ze wszystkich dobrodziejstw jakie daje nam aplikacja. Mamy tu "bogaty" edytor tekstu do zmiany opisu naszej kategorii.13

Możemy tu zobaczyć obecny obrazek, jak również załadować nowy. Możemy wysłać cały dokument (artykuł) do serwera.

14

Pod spodem mamy teraz ponownie tabelę z powiązanymi produktami, ale teraz możemy ją w bardzo prosty sposób zmieniać. Nie musimy teraz przechodzić pojedynczo po wszystkich produktach danej kategorii, teraz mamy wszystko w jednej edytowalnej tabelce.15

Poznaliśmy podstawowe funkcjonalności Iron Speed'a, które dostajemy prosto z pudełka - "out of the box" - kiedy generujemy naszą aplikację. Oczywiście wszystko, co do tej pory widzieliśmy jest całkowicie edytowalne. Mam nadzieję, że ten artykuł był pomocny jako wprowadzenie do podstaw operowania na wygenerowanej aplikacji.

Liczba ocen: 3 | Średnia ocen: 3.67

Czytaj także

 

Skomentuj

Twój komentarz
Dodaj

Komentarze

Nasz Fanpage

Popularne treści

  • .NET  
  • 3D  
  • 8  
  • ActiveDirectory  
  • AJAX  
  • amazon web services  
  • Android  
  • Android Market  
  • AngularJS  
  • Animacja  
  • API  
  • aplikacje  
  • Aplikacje wielojęzyczne  
  • asembler  
  • ASHX  
  • ASP.NET  
  • ASP.NET MVC  
  • assembler  
  • Automated Installation Kit  
  • Azure  
  • bezpieczeństwo  
  • bing  
  • Blender  
  • C#  
  • certyfikat  
  • chmura  
  • cloud computing  
  • cmd  
  • Cmdlet  
  • Cmdlet’ów  
  • core  
  • CSS  
  • Cycles  
  • developer  
  • Entity Framework  
  • Expression Blend  
  • fitl  
  • google  
  • google app engine  
  • googlemaps  
  • GPU  
  • Grafika  
  • GroupPolicy  
  • hamachi  
  • hyperv  
  • hyper-v  
  • IaaS  
  • ImageX  
  • instalacja aplikacji  
  • interface  
  • interfejs  
  • Iron Speed  
  • java  
  • JavaScript  
  • jQuery  
  • Kinect  
  • Knockout  
  • kolokacja  
  • konsola  
  • LINQ  
  • LINQ to SQL  
  • Linux  
  • MakeCert  
  • maps  
  • microsoft  
  • mobile  
  • moduły  
  • MVC  
  • mySQL  
  • OpenSource  
  • openstreet  
  • openvpn  
  • PaaS  
  • partycja  
  • PHP  
  • pliki apk  
  • pon  
  • powershell  
  • preview  
  • programowanie  
  • przeglądarka  
  • przetwarzanie w chmurze  
  • przewodnik  
  • Qt  
  • RAD  
  • Rendering  
  • SaaS  
  • script  
  • SDK  
  • server  
  • serwer  
  • Skalowanie  
  • SQL  
  • Systemy operacyjne  
  • światłowody  
  • Światłowód  
  • Template  
  • ubuntu  
  • virtual  
  • Visual Studio  
  • vpn  
  • WAIK  
  • WCF  
  • WebAdministration  
  • WebApi  
  • Windows  
  • windows azure  
  • Windows PE  
  • Windows Phone  
  • WinFroms  
  • wirtualizacja  
  • WPF  
  • XAML  
  • zdalny  
  • zdjęcia  
Komu polecasz tą stronę? (email)
Poleca (twoje imie/pseudonim)
Treść (opcjonalnie) Do Twojej treści zostanie dodany link polecanej strony
POLECAM