6

アプリケーションのログイン画面を設計しようとしているメトロ アプリケーションがあります。ここでは、Microsoft ログイン画面のようなログイン画面を設計したいと考えています。XAML でポップアップ コントロールが見つかりましたが、html 5 では見つかりませんでした。メトロ アプリには特別なコントロールがありました。ログイン ページを次のようにデザインしたいと考えています。

ここに画像の説明を入力 ありがとうございました。

<body style="background-color:#1d3665;">
<div class="loginPage fragment">
    <header aria-label="Header content" role="banner">
        <button class="win-backbutton" aria-label="Back" disabled></button>
        <h1 class="titlearea win-type-ellipsis">
            <span class="pagetitle">Welcome to loginPage</span>
        </h1>
    </header>
    <section aria-label="Main content" role="main">
        <table style="position: absolute;background-color:skyblue;">
            <tr>
                <td><input type="text"><br/></td>
            </tr>
            <tr>
            <td>
                 <input type="password"/>
                </td>
            </tr>
        </table>
    </section>
</div>

4

4 に答える 4

3

WinJS.UI.Flyoutコントロールを使用します。確認ダイアログ、ログイン、ポップアップなどに使用できます。また、表示する位置を設定することもできます。

ここでドキュメントを読むことができます。ここに ガイドラインとチェックリストがあります。そして一例。

于 2012-10-12T12:54:43.773 に答える
2

JavaScript Windows ストア アプリケーションは、Microsoft アカウントのサインイン ダイアログのように見える/動作する組み込みのポップアップにアクセスできません。

には単純なメッセージ ボックスエクスペリエンスがありますWindows.UI.Popups.MessageBoxが、追加のコントロールなどを追加する機能はありません。

あなたの経験のために、あなたはモーダルUIを探しています-比較的簡単に自分で構築できるように構築します（position: absoluteボディに要素を追加して、画面全体に表示するだけです-残りの要素の子/位置はあなたの完全なコントロールで）、または Mayur が提案したように、そこにある多くのヘルパー ライブラリの 1 つを使用します。

于 2012-10-08T13:41:11.873 に答える
1

Microsoft アカウント (既定の Microsoft アカウント ログイン ボックスを提供) に対して認証している場合は、Microsoft アカウントにログインする Live SDK を試すことができます。また、Microsoft アカウントに似た UI を使用して独自のログイン メカニズムを作成する場合は、JQuery UI プラグインを試してカスタマイズすることができます。組み込みのポップアップ コントロールがあります。

于 2012-10-08T10:24:09.857 に答える
0

このチュートリアルを見てください。とても助かります。

http://www.c-sharpcorner.com/UploadFile/63f5c2/login-windows-store-apps/

于 2013-02-12T08:19:29.607 に答える