Show Menu
TÓPICOS×

Personalização do tema

Você pode personalizar o código HTML e o arquivo CSS para fornecer uma aparência distinta e específica da organização ao aplicativo AEM Forms. Por exemplo, é possível alterar a cor e a altura do plano de fundo de tarefas ou Pontos de partida. O exemplo a seguir fornece instruções para alterar:
  • instruções de exibição no lugar da descrição
  • número de rotas de exibição
  • cor do gradiente do plano de fundo

Etapas

  1. Abra seu projeto.
    • Para iOS, abra Capture.xcodeproj no Xcode
    • Para Android, abra o projeto do Android no Eclipse.
    • Para Windows, abra MWSWindows.sln no Visual Studio.
  2. Navegue até a pasta de modelos.
    • No Xcode, navegue até a pasta Capture > www > wsmobile > js > tempo de execução > modelos .
    • No Eclipse, navegue até a pasta assets > www > wsmobile > js > tempo de execução > modelos .
    • No Visual Studio, navegue até a pasta MWSWwindows > www > wsmobile > js > tempo de execução > modelos .
  3. Open the template.html file for editing.
  4. Localize a seguinte string:
    <%if ( (task.description !== "") && (task.description !== null) && (typeof task.description !== null) && (typeof task.description !== 'undefined') ) {%>
                   <div class="description_details">
                     <%= task.description %>
                   </div>
                  <%} else
    
    
    Substitua-o por <% .
  5. Localize o seguinte código no template.html arquivo:
    <ul id="task_menu_list">
                                    <li class="approve" title="<%= task.availableCommands.directCommands[0]%>" data-routename="<%= task.availableCommands.directCommands[0]%>">
                                        <%= task.availableCommands.directCommands[0]%>
                                    </li>
                                    <li class="reject last" title="<%= task.availableCommands.directCommands[1]%>" data-routename="<%= task.availableCommands.directCommands[1]%>">
                                        <%= task.availableCommands.directCommands[1]%>
                                    </li>
    
    
  6. Comente a linha a seguir e salve o arquivo.
    task.availableCommands.directCommands[1]%>">
    <%= task.availableCommands.directCommands[1]%>
    </li>
    
    
  7. Navegue até a pasta css.
    • No Xcode, navegue até Capture > www > wsmobile > css .
    • No Eclipse, navegue até assets > www > wsmobile > css .
    • No Visual Studio, navegue até MWSWwindows > www > wsmobile > css .
  8. Open the _style.css file for editing.
  9. Para imagem de plano de fundo, altere #323232 para #fff .
  10. Salve as alterações e feche o _style.css arquivo.
  11. Abra o aplicativo AEM Forms.
    O aplicativo AEM Forms agora exibe instruções em vez de descrição.