Apps maken en bewerken met de toepassingsconsole creating-and-editing-apps-using-the-apps-console
In het AEM ontwikkelingsproces voor mobiele toepassingen wordt erkend dat gebruikers met verschillende expertise bijdragen aan de ontwikkeling van mobiele toepassingen. De volgende procesafbeelding illustreert de algemene volgorde waarin inhoudsauteurs en toepassingsontwikkelaars taken uitvoeren.
Op deze pagina wordt informatie weergegeven over het uitvoeren van de markeringstaken. Voor informatie over de taken van de Ontwikkelaar, zie de Toepassingen van PhoneGap van de Bouwstijl.
De structuur van mobiele toepassingen the-structure-of-mobile-applications
AEM Mobile biedt de blauwdruk van de PhoneGap App voor het maken van mobiele toepassingen. De blauwdruk bepaalt de structuur van de toepassingen die u creeert. Toepassingen bestaan uit de volgende onderdelen:
- De basispagina.
- De taalvariaties van de toepassing.
- De homepage van de taalvariatie.
De hoofdmap van een PhoneGap-app the-root-of-a-phonegap-app
De hoofdpagina van de mobiele toepassingen die u in AEM maakt, wordt weergegeven in de toepassingsconsole.
De basispagina wordt opgeslagen onder de eigenschap Doelpad van de toepassing die is opgegeven bij het maken van de toepassing (het standaardpad is /content/phonegap/apps). De paginanaam is het bezit van de Naam van de toepassing. De standaard-URL van de hoofdpagina van de site met de naam myphonegapapp
is bijvoorbeeld http://localhost:4502/content/phonegap/apps/myphonegapapp.html
.
De taalvariatie van een PhoneGap-app the-language-variation-of-a-phonegap-app
De eerste onderliggende pagina's van de basispagina zijn de taalvariaties van de toepassing. De naam van elke pagina is de taal waarvoor de toepassing wordt gemaakt. Engels is bijvoorbeeld de naam van de Engelse variatie van de toepassing.
Nota: de standaardblauwdruk PhoneGap leidt slechts tot een Engelse toepassing. Uw ontwikkelaar kan de blauwdruk aanpassen zodat deze meer taalvariaties kan maken.
De taalpagina heeft twee doelen:
- De pagina-inhoud is de spash-pagina voor de taalvariatie van de toepassing.
- De pagina-eigenschappen beheren verschillende ontwerpaspecten van de toepassing, zoals de URL die moet worden gebruikt voor het aanvragen van updates van inhoud, en informatie over het maken van verbinding met de cloud en de integratie met Adobe Analytics Services.
De startpagina the-home-page
De pagina Home of index.html van een taalvariatie van een toepassing wordt weergegeven wanneer de toepassing wordt geopend. De homepage voorziet gebruikers van een menu van verbindingen aan diverse pagina's in de toepassing. Met het alineasysteem kunt u componenten aan de pagina toevoegen om inhoud te maken.
Een mobiele toepassing maken creating-a-mobile-application
Mobiele toepassingen zijn gebaseerd op een blauwdruk die een paginastructuur en eigenschappen definieert. U kunt de volgende toepassingseigenschappen configureren:
-
Titel: de toepassingstitel.
-
Weg van de Bestemming: de plaats in de bewaarplaats waar de toepassing wordt opgeslagen. Laat de standaardinstelling ongewijzigd om een pad te maken op basis van de toepassingsnaam.
-
Naam: De standaardwaarde is de waarde van het bezit van de Titel met verwijderde ruimtekarakters. De naam wordt gebruikt binnen CQ om naar de toepassing te verwijzen, bijvoorbeeld voor de opslagplaats knoop die de toepassing vertegenwoordigt.
-
Beschrijving: een beschrijving van de toepassing.
-
Server URL: URL die over-de-Air (OTA) inhoudsupdates aan de toepassing verstrekt. De standaardwaarde is de URL van de publicatieserver van de instantie die wordt gebruikt om een toepassing te maken (deze is afkomstig van de externalizer-service). Opmerking: dit moet een publicatieserverinstantie zijn in plaats van een auteur, die verificatie vereist.
U kunt ook een afbeeldingsbestand opgeven dat u als miniatuur van de toepassing wilt gebruiken, de configuratie PhoneGap Build selecteren die u wilt gebruiken en de analytische configuratie voor de mobiele app selecteren. Deze afbeelding wordt alleen gebruikt als miniatuur voor uw mobiele toepassing in de console voor mobiele apps in Experience Manager.
Er zijn extra (en optionele) tabbladen voor het samenstellen van cloudservice en het integreren van de plug-in Adobe Mobile Services SDK in uw app.
- Samenstellen: klik hier op Configuraties beheren en stel de service voor het samenstellen van build.phonegap.com in. Vervolgens kunt u in de vervolgkeuzelijst de nieuwe PhoneGap-service voor de build-cloud selecteren.
- Analytics: Klik beheert configuraties en opstelling uw 🔗 de clouddienst van SDK van de Mobiele Diensten van de Adobe . Vervolgens kunt u in het keuzemenu de nieuwe mobiele service selecteren die u wilt integreren in uw mobiele app.
In de volgende procedure wordt de Touch-gebruikersinterface gebruikt om een mobiele toepassing te maken.
-
Klik op Apps op de rail.
-
Klik het Create pictogram.
-
(Optioneel) Geef op het tabblad Geavanceerd een beschrijving voor de toepassing op en wijzig zo nodig de URL van de server.
-
(Optioneel) Als u PhoneGap Build gebruikt om de toepassing te compileren, selecteert u op het tabblad Build de configuratie die u wilt gebruiken.
Klik op Configuraties beheren om een PhoneGap-build-configuratie te maken.
-
(Optioneel) Als u SiteCatalyst gebruikt om de toepassingsactiviteit te volgen, selecteert u op het tabblad Analyse de configuratie die u wilt gebruiken.
Klik op Configuraties beheren als u een mobiele toepassingsconfiguratie wilt maken.
-
(Optioneel) Als u een toepassingspictogram wilt maken, klikt u op de knop Bladeren, selecteert u het afbeeldingsbestand in uw bestandssysteem en klikt u op Openen.
-
Klik op Maken.
De eigenschappen van een mobiele toepassing wijzigen changing-the-properties-of-a-mobile-application
Nadat u een mobiele toepassing hebt gemaakt, kunt u de eigenschappen wijzigen.
De titel, beschrijving en het pictogram wijzigen change-the-title-description-and-icon
-
Klik op Apps op de rail.
-
Selecteer de toepassing die u wilt configureren en klik op het pictogram Pagina-eigenschappen weergeven.
-
Klik op het pictogram Bewerken om eigenschapswaarden te wijzigen.
-
Configureer de eigenschappen Standaard en Geavanceerd en klik op het pictogram Gereed.
Een taalvariatie van de toepassing configureren configure-a-language-variation-of-the-application
-
Klik op Apps op de rail.
-
Klik om de mobiele toepassing die u wilt bewerken, in te roepen in de Admin Console apps. Selecteer de taalversie van de toepassing die u wilt configureren en klik op het pictogram Toepassingseigenschappen weergeven.
-
Klik op het pictogram Bewerken om eigenschapswaarden te wijzigen.
-
Configureer de eigenschappen op de tabbladen Standaard, Geavanceerd, Samenstellen en Analyse en klik vervolgens op het pictogram Gereed.
De inhoud van een mobiele toepassing ontwerpen authoring-the-content-of-a-mobile-application
Nadat u de mobiele toepassing hebt gemaakt, voegt u inhoud toe die wordt gebruikt als de interface van de toepassing.
- Klik op Apps op de rail.
- Klik op de toepassing en vervolgens op Engels.
- Bewerk de startpagina of voeg naar wens onderliggende pagina's toe.
Inhoud verplaatsen naar mobiele toepassingen moving-content-to-mobile-applications
De cache voor het synchroniseren van inhoud op de AEM-publicatie-instantie wordt gebruikt als opslagplaats voor inhoud voor mobiele toepassingen:
- Inhoud in de cache van Content Sync wordt in de toepassing opgenomen wanneer ontwikkelaars de toepassing compileren.
- Inhoud in de cache is beschikbaar voor geïnstalleerde mobiele toepassingen voor het bijwerken van de inhoud van de toepassing.
Mobiele toepassingen hebben een opdracht Updates waarmee bijgewerkte toepassingsinhoud wordt gedownload en geïnstalleerd. Wanneer een toepassingsinstantie een updateverzoek verzendt, bepaalt Content Sync welke inhoud is gewijzigd sinds de laatste keer dat de toepassing werd bijgewerkt of geïnstalleerd, en verstrekt de nieuwe inhoud.
Als u bijgewerkte inhoud beschikbaar wilt maken voor toepassingen, werkt u de cache van Content Sync bij. De eerste keer dat u de cache bijwerkt, wordt alle gepubliceerde inhoud toegevoegd. Bij volgende updates wordt alleen de gepubliceerde inhoud toegevoegd die is gewijzigd sinds de vorige update.
Met Content Sync wordt ook bijgehouden wanneer de updates plaatsvinden. Met deze informatie kan Content Sync bepalen welke cache-update naar een mobiele toepassing moet worden verzonden.
Voer de volgende procedure uit op de instantie waar u het cachegeheugen wilt bijwerken. Als uw toepassing bijvoorbeeld updates vraagt van de instantie publish, voert u de procedure uit op de instantie publish.
-
Klik op Apps (Apps) in de track en klik vervolgens op uw toepassing.
-
Selecteer de welkomstpagina en klik op het pictogram Cache bijwerken.
App-sjablonen gebruiken using-app-templates
Deze functie is beschikbaar in Apps 6.1 Feature Pack 2 en biedt een eenvoudige manier om bestaande toepassingssjablonen te gebruiken voor het maken van nieuwe apps binnen AEM.
Wat is een toepassingssjabloon? Beschouw het als een verzameling paginasjablonen en componenten die een basislijn of basis van een app vormen.
Wanneer u een app maakt op basis van de sjabloon van een andere app, krijgt u een app met een beginpunt dat representatief is voor de app waarin deze is gemaakt.
U moet een bestaande sjabloon voor mobiele apps (of een app met een toepassingssjabloon) hebben om deze functie te kunnen gebruiken.
Het meest recente AEM Apps 6.1 voorbeeldenpakket bevat een bijgewerkte versie van de Geometrixx-app met een toepassingssjabloon. U kunt ook de StarterKit installeren die ook een sjabloon biedt.
Stappen voor het maken van een app op basis van een toepassingssjabloon:
- Zorg ervoor dat u het nieuwste AEM Apps 6.1 functiepakket en referentiemonsteringspakketten hebt geïnstalleerd
- Klik Apps van de linkerspoorstaaf.
- Klik op de knop + Maken bovenaan en selecteer App maken.
- Als u de lijst met App Templates hebt ontvangen, selecteert u een van deze sjablonen:
-
Klik op Volgende.
-
Geef een app-id en -titel op, maar u wilt mogelijk ook een naam en een beschrijving opnemen.
- U kunt ook een PNG-bestand (ondersteunde PhoneGap-pictogramindeling) opgeven als pictogram door AEM elementen te bladeren.
- U kunt al deze velden bewerken nadat de app is gemaakt in de tegel App beheren. Met uitzondering van de toepassings-id kunt u deze niet wijzigen nadat de toepassings-id is ingesteld.
- Klik op de knop Maken. Er worden twee opties weergegeven: Gereed (ga terug naar de catalogusweergave van apps) of Toepassen beheren (hiermee wordt het dashboard van de app geopend).
- Nadat de app is gemaakt, wordt de nieuwe app weergegeven in de App-catalogus:
- Klik op de app om deze te openen. U hebt een nieuwe app gemaakt op basis van de sjabloon van een bestaande app.
De Sample Geometrixx Outdoors App verkennen exploring-the-sample-geometrixx-outdoors-app
Geometrixx Outdoors App is een voorbeeld van een PhoneGap-toepassing die de functies van de standaardblauwdruk van de PhoneGap-toepassing en de mobiele voorbeeldcomponenten demonstreert.
Als u de toepassing wilt openen, klikt u in de track op Mobiele toepassingen en selecteert u vervolgens Geometrixx Outdoors App.
Functies voor algemene pagina's - mobiele Geometrixx-app common-page-features-geometrixx-mobile-app
Elke pagina van de mobiele app bevat de volgende functies:
-
Een knop Terug om terug te keren naar de bovenliggende pagina. De knop Terug wordt niet weergegeven op de startpagina.
-
Een uitbreidbare rail met een menu van opdrachten en koppelingen:
- Open de pagina Locaties.
- Open de winkelwagen.
- Log in.
- Werk de toepassing bij.
-
Het alineasysteem voor het toevoegen van componenten en het maken van inhoud.
De startpagina - de mobiele toepassing Geometrixx the-home-page-geometrixx-mobile-app
De inhoud van de startpagina bestaat uit de volgende navigatiegereedschappen:
- Een component Menu List die koppelingen biedt naar de onderliggende pagina's Gear, Reviews, News en About US.
- Een Veeggebaar waarmee de onderliggende pagina's worden weergegeven.
De tandwielpagina - de mobiele toepassing van Geometrixx the-gear-page-geometrixx-mobile-app
De pagina Gear biedt gebruikers toegang tot productpagina's. Een component van de menulijst verleent toegang tot de kindpagina's van de pagina van het Gear. De onderliggende pagina's zijn productcategorieën die de website bevat.
- Seizoen
- Deksel
- Geslacht
- Activiteit
Elke categoriepagina gebruikt dezelfde inhoudsstructuur als de pagina Verwerk. De carrousel biedt toegang tot onderliggende pagina's die subcategorieën van producten zijn. De subcategoriepagina's bevatten productaanbiedingen met koppelingen naar productpagina's.
De productpagina - de mobiele toepassing van Geometrixx the-products-page-geometrixx-mobile-app
De pagina Producten en zijn hiërarchie van kindpagina's voeren een classificatiesysteem voor productpagina's uit. De laagste pagina's in elke vertakking van de hiërarchie zijn een productpagina die een ng component van het Product bevat.
De pagina Producten is niet beschikbaar voor gebruikers van de toepassing. De pagina Gear biedt toegang tot elke productpagina.
De pagina Revisies - Geometrixx Mobile-app the-reviews-page-geometrixx-mobile-app
Bevat een knop Terug. Met het alineasysteem kunt u componenten toevoegen.
Als u de toepassing gebruikt, is de pagina Revisies beschikbaar via de carrousel op de pagina Engels.
De nieuwspagina - Geometrixx Mobile-app the-news-page-geometrixx-mobile-app
Bevat een knop Terug. Met het alineasysteem kunt u componenten toevoegen.
Wanneer u de toepassing gebruikt, is de pagina News beschikbaar via de carrousel op de Engelse pagina.
De pagina Over ons - Geometrixx Mobile-toepassing the-about-us-page-geometrixx-mobile-app
De pagina Info over ons bevat verschillende componenten Twee kolomrijen. Elke kolom bevat een component Image of Text. De componenten zijn bewerkbaar en het alineasysteem biedt u de mogelijkheid componenten toe te voegen.
Wanneer u de toepassing gebruikt, is de pagina Over gebruikers beschikbaar via de carrousel op de Engelse pagina.
De locatiepagina - Geometrixx Mobile-toepassing the-locations-page-geometrixx-mobile-app
De pagina Locations bevat een component Locations.
Wanneer u de toepassing gebruikt, is de pagina Locaties beschikbaar in de menulijst op de pagina Engels.
Voorbeeld van mobiele componenten sample-mobile-components
Verschillende componenten zijn direct beschikbaar in Sidekick wanneer u pagina's van een mobiele toepassing ontwerpt. De componenten behoren tot de PhoneGap-componentgroep.
Swipe Carousel swipe-carousel
De component VeegCarrousel is een hulpmiddel om sitepagina's weer te geven en te navigeren. De component bevat een carrousel die de afbeeldingen doorloopt voor de pagina's boven een lijst met paginakoppelingen. Bewerk de component om de pagina's op te geven die u wilt weergeven en het gedrag van de carrousel.
Afbeeldingen worden in de carrousel weergegeven voor pagina's die op een specifieke manier aan een afbeelding zijn gekoppeld. Wanneer pagina's niet aan afbeeldingen zijn gekoppeld, wordt alleen de lijst met koppelingen weergegeven.
Carousel eigenschappen tabel
Configureer het gedrag van de carrousel:
- Afspeelsnelheid: de tijd in milliseconden dat elke afbeelding wordt weergegeven voordat de volgende afbeelding wordt weergegeven.
- Overgangstijd: de duur in milliseconden van de animatie voor afbeeldingsovergangen.
- Besturingsstijl: het type besturingselement dat wordt gebruikt voor het verplaatsen tussen afbeeldingen.
de eigenschappen tabel van de Lijst
Geef op hoe de paginalijst wordt gegenereerd:
- Lijst samenstellen met: de methode die moet worden gebruikt voor het opgeven van de pagina's die moeten worden opgenomen in de carrousel. Zie De paginalijst samenstellen.
- Volgorde door: selecteer een pagina-eigenschap die u wilt gebruiken voor het sorteren van de paginalijst. Selecteer bijvoorbeeld jcr:title om pagina's alfabetisch op titel te sorteren.
- Limiet: het maximumaantal pagina's dat moet worden opgenomen. Deze eigenschap is geschikt voor op zoeken gebaseerde methoden om de paginalijst samen te stellen.
De paginalijst samenstellen building-the-page-list
De component van Carrousel van de Veeggebaar verstrekt de volgende waarden voor de Bouwstijl Lijst Gebruikend bezit. Het dialoogvenster Bewerken verandert op basis van de waarde die u selecteert:
de Pagina's van het Kind
De component bevat een lijst met alle onderliggende pagina's van een specifieke pagina. Nadat u deze waarde hebt geselecteerd, selecteert u de pagina op het tabblad Onderliggende pagina's of geeft u geen waarde op om de onderliggende pagina van de huidige pagina weer te geven.
Vaste Lijst
Geef een lijst op met pagina's van include-bestanden. Nadat u deze waarde hebt geselecteerd, configureert u de lijst op het tabblad Vaste lijst die wordt weergegeven wanneer u Vaste lijst selecteert:
- Als u een pagina wilt toevoegen, klikt u op Item toevoegen en bladert u naar de pagina.
- Gebruik de pictogrammen Pijl-omhoog en Pijl-omlaag om de pagina binnen de lijst te verplaatsen.
- Klik op de knop Verwijderen om een pagina uit de lijst te verwijderen.
De eigenschap Volgorde op heeft geen invloed op de volgorde van vaste lijsten.
Zoeken
Vul de lijst met de resultaten van een trefwoordzoekopdracht. De zoekopdracht wordt uitgevoerd in de onderliggende pagina's van een pagina die u opgeeft:
- Als u de hoofdpagina van de zoekopdracht wilt opgeven, gebruikt u de eigenschap Beginnen in om het paginapad te selecteren. Geef geen pad op om onder de huidige pagina te zoeken.
- Voer de zoektrefwoorden in de eigenschap Zoekquery in.
Geavanceerd Onderzoek
Vul de lijst gebruikend vraag van de a Querybuilder.
Afbeelding image
Voeg een afbeelding toe aan uw toepassingsinhoud.
Tekst text
Voeg rijke tekst toe aan uw toepassingsinhoud.
Locaties opslaan store-locations
De component Locaties van de Opslag voorziet gebruikers van hulpmiddelen om bedrijfsafzet te vinden:
- Zoeken
- Een lijst met locaties die dicht bij of ver van de GPS-coördinaten van het apparaat liggen.
De component vereist dat de gegevensopslagruimte locatie locatie-informatie voor elke opslagruimte bevat. De plaatsen van de steekproef zijn geïnstalleerd bij de /etc/commerce/locations/adobe knoop.
Twee kolommen, rij two-column-row
Hiermee kunt u componenten naast elkaar aan een pagina toevoegen.