Ir para o conteúdo

Criar plugins WebView com IA

Em apenas alguns passos, pode criar facilmente um serviço Web para o seu plugin WebView com IA. Não são necessários conhecimentos ou competências de programação.

Gerar ideias para plugins

Se já sabe que tipo de serviço Web pretende criar, ignore esta secção e avance para a seguinte.

Em alternativa, pode pedir ao seu sistema de IA preferido para gerar ideias.

Prompt

Quero criar uma aplicação Web que será apresentada como um plugin WebView no cTrader. 
Sugira ideias úteis que irão melhorar a minha experiência de negociação.
Resposta
  • Assistente de negociação inteligente
  • Calculadora de negociação
  • Painel de controlo de símbolos personalizado
  • Notas de símbolos e ferramenta de colaboração
  • Painel de controlo de gestão de risco
  • Rastreador de impacto de notícias
  • Ferramenta de mapa de calor de sessão
  • Copiloto de negociação (notas e feedback de IA)

Gerar o código do website

Os plugins WebView no cTrader requerem websites alojados externamente que usem a pilha padrão de JavaScript, HTML, CSS e (se necessário) métodos da API WebView.

Para uma resposta mais precisa, forneça à IA os seguintes dados:

Aviso

Qualquer plugin WebView que criar deve cumprir as regras da cTrader Store, da App Store e do Google Play. Mais importante ainda, o seu serviço Web não deve incluir formulários de autenticação ou de pagamento.

Para sua comodidade, pode transferir a documentação do plugin WebView e as regras da cTrader Store, caso prefira carregá-las como ficheiros para a IA consultar.

Prompt

Quero criar uma aplicação Web de calculadora de negociação para ser usada como um plugin WebView no cTrader. 
O website deve ser construído usando apenas JavaScript, HTML, CSS e os métodos da API para plugins WebView. 
Não devem ser necessárias bibliotecas adicionais. 
O website deve cumprir as regras da cTrader Store, da App Store da Apple e da Play Store da Google.
O website não deve incluir formulários de autenticação ou pagamento.
Forneça um único código que contenha tudo o necessário para construir o website sem configuração adicional.
Resposta 
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8" />
  <meta name="viewport" content="width=device-width, initial-scale=1.0"/>
  <title>Trade Calculator</title>
  <style>
    body {
      font-family: Arial, sans-serif;
      margin: 20px;
      background-color: #f4f4f4;
      color: #333;
    }
    h1 {
      text-align: center;
    }
    .container {
      max-width: 400px;
      margin: auto;
      padding: 20px;
      background: white;
      border-radius: 10px;
      box-shadow: 0 0 10px rgba(0,0,0,0.1);
    }
    label, input, select {
      display: block;
      width: 100%;
      margin-bottom: 15px;
    }
    input, select {
      padding: 8px;
      font-size: 1em;
    }
    button {
      padding: 10px;
      background-color: #007acc;
      color: white;
      border: none;
      font-size: 1em;
      cursor: pointer;
      width: 100%;
    }
    button:hover {
      background-color: #005fa3;
    }
    .result {
      margin-top: 20px;
      font-weight: bold;
    }
  </style>
</head>
<body>
  <div class="container">
    <h1>Trade Calculator</h1>
    <label for="symbol">Symbol (e.g., EURUSD)</label>
    <input type="text" id="symbol" value="EURUSD"/>

    <label for="volume">Volume (Lots)</label>
    <input type="number" id="volume" value="1" min="0.01" step="0.01"/>

    <label for="price">Price</label>
    <input type="number" id="price" value="1.1000" step="0.0001"/>

    <label for="leverage">Leverage</label>
    <input type="number" id="leverage" value="100" step="1"/>

    <button onclick="calculate()">Calculate</button>

    <div class="result" id="result">Margin: --</div>
  </div>

  <script>
    function calculate() {
      const volume = parseFloat(document.getElementById("volume").value);
      const price = parseFloat(document.getElementById("price").value);
      const leverage = parseFloat(document.getElementById("leverage").value);

      // Standard 100,000 units per lot
      const notional = 100000 * volume;
      const marginRequired = (notional / leverage) * price;

      document.getElementById("result").innerText = 
        `Margin Required: ${marginRequired.toFixed(2)} (base currency units)`;
    }

    // WebView Plugin API Example
    window.addEventListener("message", (event) => {
      const message = event.data;
      if (message.type === "symbolUpdate") {
        document.getElementById("symbol").value = message.symbol;
      }
    });

    // Send initial readiness signal
    window.parent.postMessage({ type: "ready" }, "*");
  </script>
</body>
</html>

Implementar o serviço Web

Cole o código gerado num ficheiro HTML e guarde-o (localmente) no seu computador.

Para implementar o serviço Web, precisa de alojar o ficheiro HTML num servidor seguro. Tem de adquirir um nome de domínio, registar-se num fornecedor de alojamento e depois carregar o seu ficheiro HTML usando cPanel/hPanel ou via FTP.

Pode pedir ajuda à IA usando estes prompts:

Prompt

Explique-me como obter um nome de domínio e configurá-lo com um fornecedor de alojamento.

Testar a aplicação Web

Abra o novo website no seu browser. Teste as funcionalidades no site para confirmar que funcionam corretamente.

Dependendo da aparência do seu website em funcionamento, poderá querer voltar à sua ferramenta de IA e pedir-lhe melhorias. Por exemplo, pode pedir à IA para editar o código do website da seguinte forma:

  • Corrigir uma funcionalidade que não está a funcionar corretamente
  • Alterar o tema de cores
  • Adicionar uma funcionalidade específica
  • Remover uma funcionalidade específica
  • E mais

Depois de fazer os ajustes, volte ao ficheiro, cole o código editado e implemente as alterações.

Quando a sua aplicação Web estiver pronta e souber o URL, pode prosseguir para construir o seu plugin WebView no cTrader.