仅使用 C# 代码使用 IValueConverter 呈现 UI [英] Rendering a UI using IValueConverter using just c# code

查看:15
本文介绍了仅使用 C# 代码使用 IValueConverter 呈现 UI的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我是 c# 和 silverlight-5 初学者.

I am c# and silverlight-5 beginner.

首先,我必须通过反序列化一个 xml 字符串来创建对象.我已经成功地做到了,但现在我的下一步是使用对象元素创建 GUI.我知道我必须使用IValueConverter"来做到这一点.但我不知道这是怎么回事.

First i had to create object by deserializing an xml string. I have done that succesfully but now my next step is to create GUI using the object elements. I have idea that i have to use "IValueConverter" for doing this. But how that i dont know.

包含对象的我的程序类是这样的:

My Program class which contains the object is like this:

using System;
using System.Net;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Documents;
using System.Windows.Ink;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Animation;
using System.Windows.Shapes;
using System.Runtime.Serialization.Json;
using System.Runtime;
using System.Xml.Serialization;
using System.Runtime.Serialization;
using System.IO;
using System.Collections.Generic;
using System.Diagnostics;
using System.Xml;
using System.Collections;
namespace Model.XML
{
    public class ProgramControl
    {
        public static void Main()
        {
            string xmlstring = @"<?xml version='1.0' encoding='utf-8' ?> 
                       <parameter>  
                       <name>max_amount</name>
                       <label>Max Amount</label>
                       <unit>Millions</unit>
                       <component>
                       <type>Combo</type>
                       <attributes>
                       <type>Integer</type>
                       <displayed>4</displayed>
                       <selected>0</selected>
                       <items>
                       <item>5</item>
                       <item>10</item>
                       <item>20</item>
                       <item>50</item>
                       </items>
                       </attributes>
                       </component >
                       </parameter>";    

            XmlSerializer deserializer = new XmlSerializer(typeof(Parameter));
            XmlReader reader = XmlReader.Create(new StringReader(xmlstring));

            Parameter parameter = (Parameter)deserializer.Deserialize(reader);


            foreach (var item in parameter.Component.Attributes.Items)
            {
                Debug.WriteLine(item);
            }    

            Debug.WriteLine(parameter.Component.Type);
            Debug.WriteLine(parameter.Name);
            Debug.WriteLine(parameter.Label);
            Debug.WriteLine(parameter.Unit);

        } 
    }
}

现在的问题是如何从反序列化(IValueConverter)获得的对象创建GUI?

我不知道如何实现它:

首先是在包含IValueConverter"接口的类中,我们必须将(使用 Convert() 函数)将对象(在反序列化时获得)转换为参数,然后将这些参数(包含在 c# 中创建的组合框)通过return 到包含容器的 xaml 代码,用于渲染我们刚刚使用 c# 创建的 GUI.

First thing is in the class containing "IValueConverter" interface we have to convert(using Convert() function) the objects(obtained on deserializing) in to parameters and then pass those parameteres (containing combo box created in c# here) through return to the xaml codewhich contains the container to render the GUI we just created using c#.

在 Xaml 代码中,我们只需要创建容器,该容器将显示我们在上一步中在 c# 代码中创建的组合框和其他标签和文本.(此处我们不必使用 xaml 创建组合框,它是在包含返回 UI 的 IValueConverter 接口的类中的 C# 代码中创建的.

And in Xaml code we just need to create container which will display the combo box and other labels and text we created in c# code in previous step. (We don't have to create combo box using xaml here, it is created in c# code inside the class containing IValueConverter interface which returns the UI).

例如:(为了让你理解正确是一个粗略的想法,可能存在一些语法错误):

For example: (It's rough idea to make you understand properly, there may be some syntatical error):

我的MyValueConverter.cs"类是假设:

My "MyValueConverter.cs" class is suppose:

public class MyValueConverter : IValueConverter
{
    #region IValueConverter Members

    public object Convert(object value, Type targetType,
                          object parameter, CultureInfo culture) 
    {

        List<parameter> list = value as List<Parameter>;
        List<UIElement> result = new List<UIElement>();

        foreach(parameter p in list)
        {
            UIElement newEle = null;
            if (p.component.type == "Combo")
            {
                newEle = new ComboBox();

            }
            result.add(newEle);
        }
        return result;
        /////////////////////////////////////////////////
        //////////////// and so on ://///////////////////
        /////////////////////////////////////////////////
    }
}

而在 xaml 文件中,我必须创建一个容器来呈现在 c#(IValueConverter 接口类)中创建的 UI.所以我们必须选择任何一个容器,它必须能够渲染组合框、标签、文本和快照 GUI 中显示的所有数据(容器可以是 StackPanel,因为要显示的东西不止一个).

Whereas in xaml file i have to create a container that will render the UI created in c#(IValueConverter interface class). So we have to chose any container which must be capable of rendering the combo box , label, text all the datas shown in GUI of snapshot (conatiner could be StackPanel because there are more than one thing to be displayed).

我的 xaml 代码将只包含一个这样的容器:

my xaml code will be just containign a container like this:

<UserControl x:Class="RenderingTest.MainPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:controls="clr-namespace:System.Windows.Controls;assembly=System.Windows.Controls"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    xmlns:this="clr-namespace:RenderingTest.Converters"
    mc:Ignorable="d"
    d:DesignHeight="300" d:DesignWidth="400">

    <UserControl.Resources>
        <this:MyValueConverter x:Key="ImageConverter"/>
    </UserControl.Resources>
    <Grid x:Name="LayoutRoot" Background="White" Width="Auto" Height="Auto">
        <!-- There should be container here to render the combo box
             created using c# code in "MyValueConverter" class -->
    </Grid>
</UserControl>

对实现它有什么帮助吗?如果还不明白,请不要犹豫,问.

Any help in achieveing it please ? Please do not hesitate to ask if couldn't understand yet.

推荐答案

您可以为此使用隐式数据类型.

You could use Implicit Data Types for this.

在您的 xaml 中,您为特定数据类型定义了一个模板:

In your xaml you define a template for a certain datatype:

<DataTemplate DataType="ComboParameter">
        <StackPanel Orientation="Horizontal">
            <TextBlock Text={Binding Path=label}" />
            <ComboBox ItemsSource="{Binding Path=items}"/>
            <TextBlock Text="{Binding Path=unit}"/>
        </StackPanel>
</DataTemplate>

您最好根据 type-element 值创建不同的类型.另一种解决方案是为类型 Parameter 创建一个大模板,并根据 Parameter-type 包含的内容显示适当的元素.但我不会推荐这种方法.

You better create different types depending on the type-element value. Another solution is to create a large template for the type Parameter, and show the appropriate elements depending on what the Parameter-type contains. But I wouldn't recommend this approach.

然后你可以使用一个ItemsControl来显示所有的参数:

Then you can use an ItemsControl to display all parameters:

<ItemsControl ItemsSource="{Binding Path=Parameters}" />

不同的参数会根据它的类型以不同的方式呈现.

The different parameters will be rendered in different ways depending on what type it has.

这篇关于仅使用 C# 代码使用 IValueConverter 呈现 UI的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆