zoukankan      html  css  js  c++  java
  • TextBloc研究

    常用的TextBlock使用如下:

    <TextBlock Name="textBlock1" TextWrapping="Wrap">
      <Bold>TextBlock</Bold> is designed to be <Italic>lightweight</Italic>,
      and is geared specifically at integrating <Italic>small</Italic> portions
      of flow content into a UI.
    </TextBlock>
    <Button Width="100" Margin="10">Click Me</Button>
    <TextBlock  Name="textBlock2" 
      TextWrapping="Wrap" Background="AntiqueWhite" TextAlignment="Center"
    >
      By default, a TextBlock provides no UI beyond simply displaying its contents.
    </TextBlock>
    <Button Width="100" Margin="10">Click Me</Button>

    显示如下:

    但是当碰到这种需求:

    一个字符窜,分三段组成,第一段一种字体,常量,第二段一种字体,并且需要绑定变量,第三段又是一种字体,常量,,现在需要绑定在一个Textblock上怎么处理呢?

    有三种解决方案:

    第一种:在Textblock赋值前做处理,重新组织这个字符窜,再赋值,或者使用IValueConverter接口,但这种方式比较麻烦。

    第二种: 使用Run

     <TextBlock Grid.Row="0"
                       Margin="0,0,73,8"
                       HorizontalAlignment="Right"
                       VerticalAlignment="Center"
                       DataContext="{Binding RelativeSource={RelativeSource AncestorType=local:MainWindow},
                                             Path=Timer}"
                       Visibility="{Binding Status,
                                            Converter={StaticResource OpVisibilityConverter}}">
                <Run Style="{DynamicResource Run.TimeoutText}" Text="超时倒计时" />
                <Run Style="{DynamicResource Run.TimeoutNumber}" Text="{Binding RemainedSeconds, Mode=OneWay}" />
                <Run Style="{DynamicResource Run.TimeoutText}" Text="秒" />
            </TextBlock>

    第三种:使用AccessText

    <TextBlock Margin="0,0,73,267"
                       DataContext="{Binding RelativeSource={RelativeSource AncestorType=local:MainWindow},
                                             Path=Timer}"
                       Visibility="{Binding Status,
                                            Converter={StaticResource OpVisibilityConverter}}">
                <AccessText Style="{DynamicResource AccessText.TimeoutText}">超时倒计时</AccessText>
                <AccessText Text="{Binding RemainedSeconds, Mode=OneWay}" Style="{DynamicResource AccessText.TimeoutNumber}"></AccessText>
                <AccessText Style="{DynamicResource AccessText.TimeoutText}"></AccessText>
            </TextBlock>


    第二,第三种方法比较推荐,比较清晰,减少了前台复杂的转换处理。

    最后效果如下:

  • 相关阅读:
    一 基础--进制转化
    七牛云上传视频并截取第一帧为图片(js实现)
    FNScanner二维码接口openView自定义扫码Demo
    UIPickerView 模块示例demo
    vPlayer 模块Demo
    doT的高级用法及loadData的使用
    acmPush模块示例demo
    UIChatBox模块示例demo
    分享一款基于aui框架的图文发布界面
    基于js的APP多语言处理
  • 原文地址:https://www.cnblogs.com/gavinhuang/p/3546085.html
Copyright © 2011-2022 走看看