2017-10-06 4 views
0

出力を希望通りに表示できないようです。私はXAMLの新機能です。現在、私の出てくるように見えます: enter image description hereいくつかの配列プロパティを持つObservable Collectionを持つListViewまたはTreeViewへのデータバインド

あなたがスクリーンショットを見ると、出力はほぼ正しいです。最初の2つの列は、自分のobservable collectに追加されたLiveCameraResultオブジェクトのプロパティです。次の4つの列(FaceId年齢性別エモーション)もLiveCameraResultオブジェクトのプロパティから来るが、プロパティには、配列(を顔)であると私はすべての出力に含まをしたいですこのオブジェクトに表示されます。これまでのところ、4つの列に対して出力を表示する唯一の方法は、[0]にインデックスを付けることによって配列の最初のエンティティを表示することでした。出力を修正して複数の顔データを表示するにはどうすればよいですか?私は運では、次のXAMLコードを試してみました

public class LiveCameraResult 
{ 
    public DateTime TimeStamp { get; set; } 
    public string SelectedCamera { get; set; } = null; 
    public string TopEmotion { get; set; } = null; 
    public string FirstIdentity { get; set; } 
    public List<String> Identity = new List<string>(); 
    public Microsoft.ProjectOxford.Face.Contract.Face[] Faces { get; set; } = null; 
    public Microsoft.ProjectOxford.Common.Contract.EmotionScores[] EmotionScores { get; set; } = null; 
    public string[] CelebrityNames { get; set; } = null; 
    public Microsoft.ProjectOxford.Vision.Contract.Tag[] Tags { get; set; } = null; 
} 

 <Grid Grid.ColumnSpan="2" Margin="5,0,0,-74.173" Grid.Row="2"> 
     <DockPanel x:Name="scrollViewContent" Margin="0,10,-5,-16.571" Height="154.901" VerticalAlignment="Top" > 
      <!--<ListView Name="LogView" ItemsSource="{Binding}" Background="#FFD4C9C9" HorizontalContentAlignment="Stretch" VerticalContentAlignment="Stretch" Margin="0,0,5,0" MinHeight="153.143" DockPanel.Dock="Top" IsSynchronizedWithCurrentItem="True" >--> 
       <!--<ListView.View >--> 
       <TreeView ItemsSource="{Binding}"> 
            
        <!-- Conference template --> 
            
        <TreeView.ItemTemplate> 
         <HierarchicalDataTemplate ItemsSource="{Binding}"> 
          <TextBlock Foreground="Red" Text="{Binding TimeStamp}" /> 
          <!-- Team template --> 
          <HierarchicalDataTemplate.ItemTemplate> 
           <HierarchicalDataTemplate> 
           <TextBlock Foreground="Red" Text="{Binding Path=Faces.FaceAttributes.Gender}"/> 

            <!-- Player template --> 
            <HierarchicalDataTemplate.ItemTemplate> 
             <DataTemplate> 
              <TextBlock Text="{Binding}" /> 
             </DataTemplate> 
            </HierarchicalDataTemplate.ItemTemplate> 
           </HierarchicalDataTemplate> 
          </HierarchicalDataTemplate.ItemTemplate> 
         </HierarchicalDataTemplate> 
        </TreeView.ItemTemplate> 
       </TreeView> 

私のオリジナルのXAMLは、このように見えた:ここに私のLiveCameraResultクラスは次のようになります。

<Grid Grid.ColumnSpan="2" Margin="5,0,0,-74.173" Grid.Row="2"> 
     <DockPanel x:Name="scrollViewContent" Margin="0,10,-5,-16.571" Height="154.901" VerticalAlignment="Top" > 
      <ListView Name="LogView" ItemsSource="{Binding}" Background="#FFD4C9C9" HorizontalContentAlignment="Stretch" VerticalContentAlignment="Stretch" Margin="0,0,5,0" MinHeight="153.143" DockPanel.Dock="Top" IsSynchronizedWithCurrentItem="True" > 
       <ListView.View > 
        <GridView ScrollViewer.VerticalScrollBarVisibility="Visible" ScrollViewer.CanContentScroll="True" > 
         <GridViewColumn Width="auto" > 
          <GridViewColumnHeader Tag="Timestamp" Content="Timestamp" Padding="10,0,2,0" > 
           <GridViewColumnHeader.Background> 
            <LinearGradientBrush EndPoint="0,1" StartPoint="0,0"> 
             <GradientStop Color="White" Offset="0"/> 
             <GradientStop Color="White" Offset="0.4091"/> 
             <GradientStop Color="#FFF7F8F9" Offset="1"/> 
            </LinearGradientBrush> 
           </GridViewColumnHeader.Background> 
          </GridViewColumnHeader> 
          <GridViewColumn.CellTemplate> 
           <DataTemplate> 
            <Grid> 
             <TextBlock Text="{Binding TimeStamp}"/> 
            </Grid> 
           </DataTemplate> 
          </GridViewColumn.CellTemplate> 
         </GridViewColumn> 
         <GridViewColumn Width="auto" > 
          <GridViewColumnHeader Tag="Source" Content="Source" Padding="10,0,2,0" ScrollViewer.CanContentScroll="True" /> 
          <GridViewColumn.CellTemplate> 
           <DataTemplate> 
            <Grid> 
             <TextBlock Text="{Binding SelectedCamera}"/> 
            </Grid> 
           </DataTemplate> 
          </GridViewColumn.CellTemplate> 
         </GridViewColumn> 
         <GridViewColumn Width="auto" > 
          <GridViewColumnHeader Tag="Face ID" Content="Face ID" Padding="10,0,2,0" MinWidth="159.413" /> 
          <GridViewColumn.CellTemplate> 
           <DataTemplate> 
            <Grid> 
             <TextBlock DataContext="{Binding Path=Faces}" Text="{Binding Path=FaceId}"/> 
            </Grid> 
           </DataTemplate> 
          </GridViewColumn.CellTemplate> 
         </GridViewColumn> 
         <GridViewColumn Width="auto" > 
          <GridViewColumnHeader Tag="Gender" Content="Gender" Padding="10,0,2,0" MinWidth="61.102" /> 
          <GridViewColumn.CellTemplate> 
           <DataTemplate> 
            <Grid> 
             <TextBlock Text="{Binding Path=Faces[0].FaceAttributes.Gender}"/> 
            </Grid> 
           </DataTemplate> 
          </GridViewColumn.CellTemplate> 
         </GridViewColumn> 
         <GridViewColumn Width="auto" > 
          <GridViewColumnHeader Tag="Age" Content="Age" Padding="10,0,2,0" MinWidth="42.797" /> 
          <GridViewColumn.CellTemplate> 
           <DataTemplate> 
            <Grid> 
             <TextBlock Text="{Binding Path=Faces[0].FaceAttributes.Age}"/> 
            </Grid> 
           </DataTemplate> 
          </GridViewColumn.CellTemplate> 
         </GridViewColumn> 
         <GridViewColumn Width="auto" > 
          <GridViewColumnHeader Tag="Emotion" Content="Emotion" Padding="10,0,2,0" MinWidth="110" /> 
          <GridViewColumn.CellTemplate> 
           <DataTemplate> 
            <Grid> 
             <TextBlock Text="{Binding Path=TopEmotion}"/> 
            </Grid> 
           </DataTemplate> 
          </GridViewColumn.CellTemplate> 
         </GridViewColumn> 
         <GridViewColumn Width="auto" > 
          <GridViewColumnHeader Tag="Identity" Content="Identity" Padding="10,0,2,0" MinWidth="119.388" /> 
          <GridViewColumn.CellTemplate> 
           <DataTemplate> 
            <Grid> 
             <TextBlock Text="{Binding Path=FirstIdentity}"/> 
            </Grid> 
           </DataTemplate> 
          </GridViewColumn.CellTemplate> 
         </GridViewColumn> 
        </GridView> 
       </ListView.View> 
      </ListView> 
     </DockPanel> 
    </Grid> 

はここだけですjson形式の1つのLiveCameraResultオブジェクト:

{"TimeStamp":"2017-09-30T17:34:26.3317547-04:00","SelectedCamera":"Camera 1","TopEmotion":null,"Faces":[{"FaceId":"9b512175-59f3-4a1c-b19e-d650cda0bffc","FaceRectangle":{"Width":159,"Height":159,"Left":311,"Top":233},"FaceLandmarks":null,"FaceAttributes":{"Age":48.4,"Gender":"male","HeadPose":{"Roll":1.9,"Yaw":7.6,"Pitch":0.0},"Smile":0.0,"FacialHair":{"Moustache":0.5,"Beard":0.5,"Sideburns":0.3},"Emotion":{"Anger":0.0,"Contempt":0.0,"Disgust":0.0,"Fear":0.0,"Happiness":0.0,"Neutral":0.997,"Sadness":0.003,"Surprise":0.0},"Glasses":"NoGlasses","Blur":null,"Exposure":null,"Noise":null,"Makeup":{"EyeMakeup":false,"LipMakeup":false},"Accessories":null,"Occlusion":null,"Hair":{"Bald":0.17,"Invisible":false,"HairColor":[{"Color":"Black","Confidence":0.99},{"Color":"Other","Confidence":0.64},{"Color":"Gray","Confidence":0.59},{"Color":"Brown","Confidence":0.56},{"Color":"Red","Confidence":0.09},{"Color":"Blond","Confidence":0.04}]}}},{"FaceId":"19f12175-59f3-4a1c-b19e-83cccda06aa2","FaceRectangle":{"Width":120,"Height":120,"Left":211,"Top":133},"FaceLandmarks":null,"FaceAttributes":{"Age":36.4,"Gender":"female","HeadPose":{"Roll":1.9,"Yaw":7.6,"Pitch":0.0},"Smile":0.0,"FacialHair":{"Moustache":0.0,"Beard":0.0,"Sideburns":0.3},"Emotion":{"Anger":1.0,"Contempt":0.0,"Disgust":0.0,"Fear":0.0,"Happiness":0.0,"Neutral":0.597,"Sadness":0.003,"Surprise":0.0},"Glasses":"SunGlasses","Blur":null,"Exposure":null,"Noise":null,"Makeup":{"EyeMakeup":true,"LipMakeup":false},"Accessories":null,"Occlusion":null,"Hair":{"Bald":0.17,"Invisible":false,"HairColor":[{"Color":"Black","Confidence":0.99},{"Color":"Other","Confidence":0.64},{"Color":"Gray","Confidence":0.59},{"Color":"Brown","Confidence":0.56},{"Color":"Red","Confidence":0.09},{"Color":"Blond","Confidence":0.04}]}}}],,"EmotionScores":null,"CelebrityNames":null,"Tags":[{"Name":"person","Confidence":0.99842345714569092,"Hint":null},{"Name":"man","Confidence":0.981597900390625,"Hint":null},{"Name":"indoor","Confidence":0.95850932598114014,"Hint":null},{"Name":"window","Confidence":0.9486764669418335,"Hint":null}],"Animal":null,"Building":null,"Trans":null,"People":null,"Object":null,"Food":null,"Text":null,"Plant":null,"Indoor":null,"Dark":null,"Sky":null,"Outdoor":null,"Abstract":null,"Ocr":null} 

要約すると、このログは3秒ごとに更新され、リアルタイムのデータを提供します。タイムスタンプとカメラの出力は正しいですが、残りの列は、複数の面のデータを保持するオブジェクト内の配列であるプロパティから取得されます。どのようにしてデータを表示すれば、カメラ1から10時30分に4人の顔が撮影されたら、自分の顔のID、性別、年齢、身元を見ることができます。

私はリストボックスとのDataTemplateを使用してみました

答えて

0

、それをチェックアウト:

<StackPanel HorizontalAlignment="Left"> 
    <StackPanel.ScrollOwner> 
     <ScrollViewer/> 
    </StackPanel.ScrollOwner> 
    <StackPanel Orientation="Horizontal" Background="White"> 
     <Border BorderThickness="2" BorderBrush="#FFCB9C9C"> 
      <TextBlock x:Name="TimeStampTextBLK" TextWrapping="Wrap" Text="Time Stamp" FontSize="24" Padding="50,10"/> 
     </Border> 
     <Border BorderThickness="2" BorderBrush="#FFCB9C9C"> 
      <TextBlock x:Name="SourceTextBLK" TextWrapping="Wrap" Text="Source" FontSize="24" Padding="20,10"/> 
     </Border> 
     <Border BorderThickness="2" BorderBrush="#FFCB9C9C"> 
      <TextBlock x:Name="FaceIDTextBLK" TextWrapping="Wrap" Text="Face ID" FontSize="24" Padding="150,10"/> 
     </Border> 
     <Border BorderThickness="2" BorderBrush="#FFCB9C9C"> 
      <TextBlock x:Name="GenderTextBLK" TextWrapping="Wrap" Text="Gender" FontSize="24" Padding="30,10"/> 
     </Border> 
     <Border BorderThickness="2" BorderBrush="#FFCB9C9C"> 
      <TextBlock x:Name="AgeTextBLK" TextWrapping="Wrap" Text="Age" FontSize="24" Padding="30,10"/> 
     </Border> 
     <Border BorderThickness="2" BorderBrush="#FFCB9C9C"> 
      <TextBlock x:Name="EmotionTextBLK" TextWrapping="Wrap" Text="Emotion" FontSize="24" Padding="60,10"/> 
     </Border> 
     <Border BorderThickness="2" BorderBrush="#FFCB9C9C"> 
      <TextBlock x:Name="IdentityTextBLK" TextWrapping="Wrap" Text="Identity" FontSize="24" Padding="60,10"/> 
     </Border> 
    </StackPanel> 
    <ListBox x:Name="MainListBox" Background="#FFCB9C9C" BorderBrush="{x:Null}" BorderThickness="0"> 
     <ListBox.ItemTemplate> 
      <DataTemplate> 
       <StackPanel Orientation="Horizontal"> 
        <Border Width="{Binding ActualWidth, ElementName=TimeStampTextBLK, Mode=OneWay}"> 
         <TextBlock Text="{Binding Path=TimeStamp}" HorizontalAlignment="Center" VerticalAlignment="Center" FontSize="24" Margin="5"/> 
        </Border> 
        <Border Width="{Binding ActualWidth, ElementName=SourceTextBLK, Mode=OneWay}"> 
         <TextBlock Text="{Binding Path=SelectedCamera}" HorizontalAlignment="Center" VerticalAlignment="Center" FontSize="24" Margin="5"/> 
        </Border> 
        <Border Width="{Binding ActualWidth, ElementName=FaceIDTextBLK, Mode=OneWay}"> 
         <TextBlock Text="{Binding Path=Faces}" HorizontalAlignment="Center" VerticalAlignment="Center" FontSize="24" Margin="5"/> 
        </Border> 
        <Border Width="{Binding ActualWidth, ElementName=GenderTextBLK, Mode=OneWay}"> 
         <TextBlock Text="{Binding Path=Faces[0].FaceAttributes.Gender}" HorizontalAlignment="Center" VerticalAlignment="Center" FontSize="24" Margin="5"/> 
        </Border> 
        <Border Width="{Binding ActualWidth, ElementName=AgeTextBLK, Mode=OneWay}"> 
         <TextBlock Text="{Binding Path=Path=Faces[0].FaceAttributes.Age}" HorizontalAlignment="Center" VerticalAlignment="Center" FontSize="24" Margin="5"/> 
        </Border> 
        <Border Width="{Binding ActualWidth, ElementName=EmotionTextBLK, Mode=OneWay}"> 
         <TextBlock Text="{Binding Path=TopEmotion}" HorizontalAlignment="Center" VerticalAlignment="Center" FontSize="24" Margin="5"/> 
        </Border> 
        <Border Width="{Binding ActualWidth, ElementName=IdentityTextBLK, Mode=OneWay}"> 
         <TextBlock Text="{Binding Path=FirstIdentity}" HorizontalAlignment="Center" VerticalAlignment="Center" FontSize="24" Margin="5"/> 
        </Border> 
       </StackPanel> 
      </DataTemplate> 
     </ListBox.ItemTemplate> 
    </ListBox> 
</StackPanel> 
+0

おかげでダークテンプラが、私はこれは私が必要なものであるとは思いません。あなたはまだ各項目のインデックス[0]を参照しています。 – Kyle