2

新しい SearchBox ( http://msdn.microsoft.com/library/windows/apps/dn252771 ) をスタイルしてグリフのみを表示する方法の例はありますか? 一部の Windows 8.1 ストア アプリでは、検索グリフのみを含む検索ボックスが表示され、検索グリフを押すとテキスト ボックスが表示されます。

これを示すサンプルアプリを見つけることができませんでした。

4

2 に答える 2

2

Vlad's Answer が述べたように、スタイルを作成する必要があります。

ページに SearchBox を追加し、デザイナーで右クリックして [テンプレートの編集] を選択します。

次に、ブレンドのスタイル内で、通常の Focused 状態と FocusedDropDown 状態を変更して、フォーカスの変更時に自動的に表示/非表示にする必要があります。

ここでは、blend を使用した提案された手順を示します。

最終的なコードはこの要点にあります

1- 検索ボックスを追加

<SearchBox HorizontalAlignment="Right" VerticalAlignment="Top" Width="250" Margin="0,15,0,0"/>

空のボタンも追加して、検索ボックスの最初のフォーカスをキャプチャします。この回答を確認してください。

<Button Width="0" Height="0"/>

2- SearchBox を右クリックしてテンプレートを編集します

テンプレート

3- テンプレート内で、SearchBoxGrid の幅を 32 に変更してグリフのみを表示し、水平方向の配置を右に設定します。

ここに画像の説明を入力

4-ブレンドで状態タブを選択し、フォーカスされた状態を選択します。

ここに画像の説明を入力

5- SearchBoxGrid グリッドの幅を再度自動に設定し、水平方向の配置をストレッチに設定します。

ここに画像の説明を入力

またはそれらの行をフォーカスされた状態で手動で追加します

<ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(FrameworkElement.Width)" Storyboard.TargetName="SearchBoxGrid">
                                            <DiscreteObjectKeyFrame KeyTime="0">
                                                <DiscreteObjectKeyFrame.Value>
                                                    <x:Double>NaN</x:Double>
                                                </DiscreteObjectKeyFrame.Value>
                                            </DiscreteObjectKeyFrame>
                                        </ObjectAnimationUsingKeyFrames>
                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(FrameworkElement.HorizontalAlignment)" Storyboard.TargetName="SearchBoxGrid">
                                            <DiscreteObjectKeyFrame KeyTime="0">
                                                <DiscreteObjectKeyFrame.Value>
                                                    <HorizontalAlignment>Stretch</HorizontalAlignment>
                                                </DiscreteObjectKeyFrame.Value>
                                            </DiscreteObjectKeyFrame>
                                        </ObjectAnimationUsingKeyFrames>

6- フォーカスされたドロップダウン状態で、同じ 4 と 5 の手順を実行します。

于 2015-01-16T14:58:23.543 に答える
1

ページに SearchBox を追加し、デザイナーで右クリックして [テンプレートの編集] を選択します。コピーを作成し、必要に応じてスタイルを設定します。

于 2013-08-05T07:05:21.673 に答える