2016-11-23 10 views
0

Snapping Headerのガイドラインを確認しています。スナッピングヘッダー:ObjectPageHeaderContent内で使用するコントロール

ラベルとテキストのペアでフォームを準備するために、どのコントロールがObjectPageHeaderContentの子として使用されているかを知りたいと思います。実際には、ObjectStatusコントロールでVerticalLayoutを使用し、TitleおよびNumericContentで別のVerticalLayoutを使用して、ObjectPageHeaderContentの3番目のアイテムのようなアイテムを準備しています。 しかし、結果は例のようには見えません。このガイドラインでは、FormFacetとKeyValueFacetについて説明していますが、それを理解できませんでした。与えられた例と同じ結果を得るにはどうしたらいいですか?

ありがとうございます。

答えて

0

私はこの問題を理解しようとしています。 あなたが提供したリンクでは、右上の「Resources」タブ が表示され、リンク先ページの最後の章に移動します。 「Object Page Header Content(SAPUI5 Explored)」というリンクがあります。 このリンクに従うと、このページに来る ObjectPageHeaderContent 2つの例が示されています。 これらのサンプルのいずれかを選択すると、右上の「このサンプルのソースコードを表示する」というオプションがあります。 また、index.htmlとともにソースコードをダウンロードすることもできます。

これはあなたが探しているものですか?

+0

私は同じことを試しました。私は模範的な例に従って、その見栄えを得ようとしました。しかし、結果は例のようには見えません。探査では、彼は縦型レイアウトを使用しましたが、私は探検されたものをたどった。しかし、見た目は両方で同じではない。たとえば、plainTextファセットを考えてみると、私は垂直レイアウトでtitleを持つsap.m.textを使用しました。テキスト全体が1行に表示されます。しかし、この例ではレンダリングに複数の行が必要でした。同様に、他にも小さな変更が多数ありました。 – Anjali

0

私はまたそれが言及した設計要素「プレーンテキストファセットのように見えるようにするために、縦レイアウトを使用してタイトルを追加sap.uxap.sample.HeaderContent

から元のコードを使用この例ではObjectPageHeaderContent

を見てください。 " また、複数の行でレンダリングされます。 この場合、「プレーンテキストファセット」は、この要素を説明するために設計によって使用される単なる用語です。 このデザイン要素の実装は、異なるUI5コントロールを使用して実行されます。

  <ObjectPageHeaderContent> 
          <content> 
              <layout:VerticalLayout> 
                  <m:ObjectStatus title="User ID" text="12345678"/> 
                  <m:ObjectStatus title="Functional Area" text="Developement"/> 
                  <m:ObjectStatus title="Cost Center" text="PI DFA GD Programs and Product"/> 
                  <m:ObjectStatus title="Email" text="[email protected]"/> 
              </layout:VerticalLayout> 


              <layout:VerticalLayout> 
              <m:Title text="YourHeader" titleStyle="H4"/> 
              <m:Text width="200px" 
                      text="Hi, I'm Denise. I am passionate about what I do and I'll go the extra mile to make the customer win."/> 
                  <m:ObjectStatus title="Email" text="[email protected]"/> 
              </layout:VerticalLayout> 


              <m:ObjectStatus text="In Stock" state="Error"/> 

他の小さな変更点についても説明してください。

関連する問題