Elevation नियंत्रण
कार्ड और फ़्लायआउट मेनू बनाने के लिए उपयोग किया जाने वाला नियंत्रण.
विवरण
Elevation
इसका उपयोग किसी अनुभव पर ध्यान केंद्रित करने और ऐप में भौतिकता जोड़ने के लिए किया जाता है। उथले स्तर उन वस्तुओं के लिए आरक्षित होते हैं जो कैनवास या दृश्य से निकटता से जुड़े होते हैं, जैसे कि टाइलें. गहरे स्तर सतह के चारों ओर एक प्रमुख फ्रेम बनाते हैं, संवादों जैसे आत्म-निहित अनुभवों पर मजबूत ध्यान आकर्षित करते हैं. माउस हॉवर घटनाओं का समर्थन करता है.
सर्वोत्तम अभ्यासों के लिए Fluent UI ऊंचाई शैली पेज पर जाएं.
विशेषता
मुख्य गुण
गुण | विवरण |
---|---|
Depth |
शैडो की गहराई. |
HoverDepth |
होवर करने पर दिखाई देने वाली छाया की गहराई. |
स्टाइल के गुण
गुण | विवरण |
---|---|
FillColor |
Elevation नियंत्रण का पृष्ठभूमि रंग. |
HoverFillColor |
होवर करने पर दिखाई देने वाले Elevation नियंत्रण का पृष्ठभूमि रंग. |
PaddingLeft |
कार्ड और कंट्रोल बाउंड्री के बीच लेफ्ट एज गैप |
PaddingRight |
कार्ड और कंट्रोल बाउंड्री के बीच राइट एज गैप |
PaddingTop |
कार्ड और कंट्रोल बाउंड्री के बीच टॉप एज गैप |
PaddingBottom |
कार्ड और कंट्रोल बाउंड्री के बीच बॉटम एज गैप |
DarkOverlay |
सक्षम होने पर, गद्देदार क्षेत्र में एक गहरा ओवरले प्रभाव प्रदर्शित करता है. |
लेआउट कंटेनरों के साथ Elevation
पर सामग्री का प्रारूपण
(
Container
याHorizontal container
नहीं) परVertical container
नियंत्रण जोड़ें.कंटेनर में एक
Elevation
घटक जोड़ेंElevation
गुणों को इसकेContainer
पैरेंट के अनुरूप सेट करें:गुण मान X
0
Y
0
Width
Parent.Width
Height
Parent.Height
PaddingRight
,PaddingTop
औरPaddingBottom
गुणों को इसके संदर्भSelf.PaddingLeft
के अनुसार सेट करेंवांछित
Depth
चुनें औरPaddingLeft
का मान समायोजित करें ताकि छाया कट न जाए इसके लिए पर्याप्त अंतराल प्रदान करें.Vertical container
को उसी पैरेंटContainer
में डालें. इसका उपयोग कार्ड की सामग्री को होस्ट करने के लिए किया जाता है.Vertical container
गुणों कोElevation
घटक के किनारों से विज़ुअल रूप से संरेखित करने के लिए सेट करें:गुण मान X
Elevation.PaddingLeft
Y
Elevation.PaddingLeft
Width
Parent.Width - Elevation.PaddingLeft * 2
Height
Parent.Height - Elevation.PaddingLeft * 2
कार्ड को पॉप्युलेट करने के लिए
Vertical container
में सामग्री जोड़ें.
सीमाएँ
इस कोड घटक का उपयोग केवल कैनवास ऐप और कस्टम पृष्ठों में ही किया जा सकता है.