2015-10-26 13 views
18

क्या कोई भी ItemTemplate.DataTemplate और ListView समझा सकता है। इस कोड स्निपेट में। मैं वास्तव में Templates की अवधारणा को समझ नहीं पा रहा हूं, अगर कोई उस पर कुछ प्रकाश डाल सकता है तो यह पूरी तरह से मददगार होगा। मैं इस सवाल के लिए तत्पर था:यूनिवर्सल विंडोज प्लेटफ़ॉर्म (विंडोज 10 ऐप) में ListView का उपयोग कैसे करें

Metro app: ListView ItemTemplate DataTemplate for selected item

लेकिन फिर भी उलझन में। धन्यवाद! :(

<ListView Margin="10" Name="lvDataBinding"> 
    <ListView.ItemTemplate> 
      <DataTemplate> 
       <WrapPanel> 
        <TextBlock Text="Name: " /> 
        <TextBlock Text="{Binding Name}" FontWeight="Bold" /> 
        <TextBlock Text=", " /> 
        <TextBlock Text="Age: " /> 
        <TextBlock Text="{Binding Age}" FontWeight="Bold" /> 
        <TextBlock Text=" (" /> 
        <TextBlock Text="{Binding Mail}" TextDecorations="Underline" Foreground="Blue" Cursor="Hand" /> 
        <TextBlock Text=")" /> 
        </WrapPanel> 
      </DataTemplate> 
    </ListView.ItemTemplate> 
</ListView> 

उत्तर

46

ListView एक नियंत्रण है कि आप गतिशील रूप से मदों की एक सूची दिखाने के लिए करता है ताकि उपयोगकर्ता देख सकते हैं और वे जो भी आवश्यकता हो सकती है खोजने के लिए मदों की है कि सूची के माध्यम से स्क्रॉल कर सकते हैं अनुमति देता है। यह परिभाषित करने के लिए वास्तव में आसान है XAML में:।

<ListView x:Name="StudentsList" /> 

अब मान लें कि आप विश्वविद्यालय के छात्रों की एक सूची है चलो हर छात्र एक साधारण छात्र वर्ग के साथ प्रस्तुत किया जाता है

public class Student 
{ 
    public string Name { get; set; } 
    public int Age { get; set; } 
} 

वहाँ सी। दर्जनों, सैकड़ों या हजारों छात्र होंगे, इसलिए आप यूआई को स्थिर रूप से परिभाषित नहीं कर सकते हैं। आप आमतौर पर उन छात्रों को कोड-बैक में किसी प्रकार की सूची/संग्रह में रखते हैं। आप उन्हें विभिन्न स्रोतों से लाने - डेटाबेस, वेब सेवाओं, या यह कड़ी मेहनत से कोड, जैसे मैं डेमो उद्देश्यों के लिए अब क्या होगा:

private List<Student> listOfStudents = new List<Student>(); 

public MainPage() 
{ 
    this.InitializeComponent(); 

    listOfStudents.Add(new Student { Name = "John", Age = 20 }); 
    listOfStudents.Add(new Student { Name = "Bob", Age = 21 }); 
    listOfStudents.Add(new Student { Name = "Steve", Age = 19 }); 
    listOfStudents.Add(new Student { Name = "Marko", Age = 18 }); 
    listOfStudents.Add(new Student { Name = "Igor", Age = 20 }); 
    listOfStudents.Add(new Student { Name = "Ivan", Age = 20 }); 
    listOfStudents.Add(new Student { Name = "Nina", Age = 21 }); 
    listOfStudents.Add(new Student { Name = "Paul", Age = 20 }); 
    listOfStudents.Add(new Student { Name = "Ana", Age = 23 }); 
    listOfStudents.Add(new Student { Name = "Ivana", Age = 20 }); 

    StudentsList.ItemsSource = listOfStudents; 
} 

उस सूची/संग्रह ListView के लिए एक आइटम स्रोत के रूप में कार्य करता है, तो आप सेट दो कनेक्ट करने और यूआई में सूची दिखाने के लिए ListView की ItemsSource संपत्ति। ListView का उपयोग करके सभी आइटम आइटम की संख्या के बावजूद गतिशील रूप से प्रस्तुत किए जाते हैं।

अगर हम अब एप्लिकेशन भाग गया, यह हालांकि बहुत बदसूरत होगा:

Ugly ListView

आप इसे खूबसूरत बनाने के लिए एक DataTemplate परिभाषित करने की जरूरत। चूंकि प्रत्येक छात्र के पास नाम और उम्र होती है, इसलिए आप उन गुणों का उपयोग करना चाहेंगे ताकि वे सुंदर दिख सकें। यह DataTemplateListView.ItemTemplate संपत्ति को सौंपा गया है और ListView सूची में प्रत्येक आइटम के लिए इसका उपयोग करेगा।

<ListView x:Name="StudentsList"> 
    <ListView.ItemTemplate> 
     <DataTemplate> 
      <StackPanel> 
       <TextBlock Text="{Binding Name}" 
          Margin="20,0,20,8" 
          FontSize="24" 
          FontStyle="Italic" 
          FontWeight="SemiBold" 
          Foreground="DarkBlue" /> 
       <TextBlock Text="{Binding Age}" 
          Margin="20,0,20,8" 
          FontSize="16" 
          Foreground="DarkGray" 
          Opacity="0.8" /> 
      </StackPanel> 
     </DataTemplate> 
    </ListView.ItemTemplate> 
</ListView> 

देखें, मैं जो गुण दिखाने के लिए और उन्हें प्रस्तुत करने के लिए कैसे परिभाषित करने के लिए इस्तेमाल किया DataTemplate - मैं फ़ॉन्ट आकार, फ़ॉन्ट रंग, मार्जिन आदि के साथ खेला मैं मानता हूँ यह वास्तव में सुंदर नहीं है, लेकिन मुझे यकीन है कि आप बिंदु मिल जाएगा हूँ:

<TextBlock Text="{Binding Name}" ... /> 

यह basica:

A bit prettier ListView

एक और बात आप ध्यान देंगे कि मैं एक इस तरह का निर्माण बंधन प्रयोग किया जाता है lly मतलब है: जांच करें कि ऑब्जेक्ट में संपत्ति Name है और यदि ऐसा होता है, तो इसे TextBlock.Text के रूप में प्रस्तुत करें।

ध्यान दें कि चीजें अधिक जटिल हो सकती हैं ताकि आप एक सूची में विभिन्न वस्तुओं के लिए विभिन्न टेम्पलेट्स का उपयोग कर सकें, लेकिन यह मुझे लगता है कि सवाल के दायरे में नहीं है।

टीएलडीआर: ListView गतिशील रूप से वस्तुओं की एक सूची प्रस्तुत करता है। ItemsSource उस ListView के लिए आइटम स्रोत को परिभाषित करता है। DataTemplate एक टेम्पलेट को परिभाषित करता है जिसका उपयोग कुछ प्रस्तुत करने के लिए किया जाएगा। यह DataTemplateItemTemplateListView की संपत्ति को सौंपा गया है ताकि ListView जानता है कि इसे अपने आइटम को प्रस्तुत करने के लिए बिल्कुल उस टेम्पलेट का उपयोग करना चाहिए।

+0

बहुत बढ़िया! बहुत - बहुत धन्यवाद। –

+0

"menuItem" नाम "स्पेसडेमो.मोडेल का उपयोग करते हुए" नामस्थान में मौजूद नहीं है। मैं एक बहुत ही सामान्य त्रुटि प्राप्त करता हूं और मैं यहां भी समझता हूं, अगर मैं चीजों को दोबारा बदलता हूं और संघर्ष के पुन: प्रयास करने की कोशिश करता हूं तो भी मैं कर सकता हूं समस्या का समाधान नहीं है। [इस भाग पर कोई सुझाव?] –

+0

ListView स्क्रॉल करने योग्य होना चाहिए जो दुर्भाग्य से डिफ़ॉल्ट रूप से नहीं है। –

संबंधित मुद्दे