收藏本站腾讯微博新浪微博

经典论坛

 找回密码
 注册

QQ登录

只需一步,快速开始

蓝色理想 最新研发动态 网站开通淘帖功能 - 蓝色理想插件 论坛内容导读一页看论坛 - 给官方提建议

论坛活动及任务 地图和邮件任务 请多用悬赏提问 热夏来袭,选一款蓝色理想的个性T恤吧!

手机上论坛,使用APP获得更好体验 急需前端攻城狮,获得内部推荐机会 论坛开通淘帖功能,收藏终于可以分类了!

搜索
查看: 3879|回复: 3

[Silverlight] silverlight开发技巧—让silverlight支持输入文本框

[复制链接]
发表于 2007-9-4 18:01:30 | 显示全部楼层 |阅读模式
转自:80s team blog 【转载请注明】
http://blog.80s.net.cn/article.asp?id=410

众所周知,在silverlight1.0beta中是不支持inputtext(输入文本)的,但是我们可以用另外一种方法来实现输入文本的效果。
在silverlight中文本的显示可以用到两种形式
1 textblock
2 glyphs
glyphs是个不可见元素,没法对文字进行排版,而且也不常用,因此我们这个方法就用textblock来做这个inputtext。
下面讲讲原理:
silverlight支持鼠标和键盘输入,因此我们可以利用键盘输入来获取Key的value然后吧把value赋值给textblock,这样就可以简单的实现输入文本的功能了。
下面我们来看看例子:
新建一个xaml文件,在xaml中加入一个textblock,起名叫input_txt。
然后在js里addEventListener,在EventHandle里根据key的value来给textBlock赋不同值,但是这个暂时还不支持中文,因为中文的输入不是简单的键盘事件。
代码如下:
xaml:

  1. <Canvas
  2.   xmlns="http://schemas.microsoft.com/client/2007"
  3.   xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
  4.   Width="640" Height="480"
  5.   x:Name="Page"
  6.   >
  7.   <Canvas.Background>
  8.     <LinearGradientBrush EndPoint="1,0.5" StartPoint="0,0.5">
  9.       <GradientStop Color="#FF000000" Offset="0"/>
  10.       <GradientStop Color="#FFFFFFFF" Offset="1"/>
  11.     </LinearGradientBrush>
  12.   </Canvas.Background>
  13.   <Rectangle x:Name="background" Width="640" Height="480" Stroke="#FF000000">
  14.     <Rectangle.Fill>
  15.       <LinearGradientBrush EndPoint="0.519,1.273" StartPoint="0.515,-0.061">
  16.         <GradientStop Color="#FF000000" Offset="0"/>
  17.         <GradientStop Color="#FF5B5A5A" Offset="1"/>
  18.       </LinearGradientBrush>
  19.     </Rectangle.Fill>
  20.   </Rectangle>
  21.   <TextBlock Cursor="Arrow" x:Name="input_txt" Width="350" Height="20" Canvas.Left="151" Canvas.Top="132" Canvas.ZIndex="4" FontFamily="Arial" FontSize="12" Foreground="#FFFFFFFF" TextWrapping="Wrap"/>
  22.   <Rectangle x:Name="text_input_bg" Width="352" Height="22" Stroke="#FF000000" Canvas.Left="149" Canvas.Top="129" Canvas.ZIndex="3">
  23.     <Rectangle.Fill>
  24.       <LinearGradientBrush EndPoint="0.528,0" StartPoint="0.526,1.45">
  25.         <GradientStop Color="#FF000000" Offset="0"/>
  26.         <GradientStop Color="#FF696969" Offset="1"/>
  27.       </LinearGradientBrush>
  28.     </Rectangle.Fill>
  29.   </Rectangle>
  30.   <TextBlock Width="113" Height="24" Canvas.Left="263" Canvas.Top="167" Canvas.ZIndex="2" FontFamily="Arial" FontSize="14" Foreground="#FFFFFFFF" TextWrapping="Wrap"><Run Text="text input solution"/></TextBlock>
  31. </Canvas>
复制代码


javascript:

  1. if (!window.UntitledProject1)
  2.   window.UntitledProject1 = {};

  3. UntitledProject1.Page = function()
  4. {
  5. }

  6. UntitledProject1.Page.prototype =
  7. {
  8.   handleLoad: function(control, userContext, rootElement)
  9.   {
  10.     this.control = control;
  11.    
  12.     var page = rootElement.findName("Page");
  13.     page.addEventListener("KeyUp", Silverlight.createDelegate(this, this.handleKeyUp));
  14.   },
  15.   handleKeyUp: function(sender, keyEventArgs)
  16.   {
  17.     var input_txt = sender.findName("input_txt");
  18.     var keyvalue = keyEventArgs.key;
  19.     var textvalue;
  20.     switch (keyvalue)
  21.     {
  22.     case 30:
  23.       textvalue = "A";
  24.       break;
  25.     case 31:
  26.       textvalue = "B";
  27.       break;

  28.    ......

  29.     default:
  30.       textvalue ="";
  31.     }
  32.     input_txt.Text += textvalue;      
  33.   }
  34. }
复制代码
发表于 2007-9-5 08:41:13 | 显示全部楼层
现在都用1.1了,有没有1.1C#版的
回复 支持 反对

使用道具 举报

发表于 2007-9-5 08:43:14 | 显示全部楼层
1.1提供一个C#写的BUTTON的DEMO,改变成INPUT似乎也不难
回复 支持 反对

使用道具 举报

 楼主| 发表于 2007-9-5 10:09:14 | 显示全部楼层
1.1是alpha版本的,暂时不会推出,而且马上要推出的rtw也不会支持textinput
回复 支持 反对

使用道具 举报

您需要登录后才可以回帖 登录 | 注册

本版积分规则

QQ|小黑屋|Archiver|手机版|blueidea.com ( 湘ICP备12001430号 )  

GMT+8, 2020-7-13 11:50 , Processed in 0.093513 second(s), 9 queries , Gzip On, Memcache On.

Powered by Discuz! X3.2 Licensed

© 2001-2013 Comsenz Inc.

快速回复 返回顶部 返回列表