参考：http://bbs.aardio.com/forum.php?mod=viewthread&tid=7156
代码示例：

import win.ui;
/*DSG{{*/
var winform = ..win.form( bottom=399;parent=...;right=599;text="HTMLayout - 使用file控件" )
winform.add(  )
/*}}*/

import web.layout;
wbLayout = web.layout(winform)

wbLayout.html = /**
<html>
<body>

<input name="uploadedfile" type="file"
           filter="HTML files:*.htm,*.html;Text files:*.txt;All files:*.*"
           novalue="(select file)"/><br />
<div id="filepath">请选择文件<div>
</body>
</html>
**/

uploadedfile = wbLayout.getEle("uploadedfile")
uploadedfile.onButtonStateChanged = function (ltTarget,ltEle,reason,behaviorParams) {　
    wbLayout.getEle("filepath").innerText = uploadedfile.value
    uploadedfile.title = uploadedfile.value
}
uploadedfile.attachEventHandler()

winform.show()
win.loopMessage();

同时选择多个文件的控件:

import win.ui;
/*DSG{{*/
var winform = ..win.form( bottom=399;right=599;text="HTMLayout - 选择多个文件" )
winform.add(  )
/*}}*/

import web.layout;
wbLayout = web.layout(winform)

wbLayout.html = /** 
<body>
<div  .files filter="HTML files|*.htm;*.html|Text files|*.txt|All files|*.*||" > 选择文件...
  <button #files>...</button>   
</div> 
</body>
**/

wbLayout.css = /**
.files {
          width:200px; 
          padding:2px 2px 2px 7px;
          font:system;
          background:url(theme:edit-normal) expand;   
} 
.files button{ 
          margin-left:100%%;
          
} 
**/

import fsys.dlg;
wbLayout.onButtonClick = {
        files = function (ltTarget,ltEle,reason,behaviorParams) {
                import fsys.dlg;
                var files = fsys.dlg.openEx( ltEle.queryParent(".files").filter,"请选择文件");
                 
                if( files ){
                        ltEle.queryParent(".files").insertAdjacentHTML("afterEnd",string.join(files,"<br />") )
                } 
        }
}
 
winform.show() 
win.loopMessage()

file控件补充css:

import win.ui;
/*DSG{{*/
var winform = ..win.form( bottom=400;parent=...;right=600;text="aardio Form" )
winform.add(  )
/*}}*/

import web.layout
wb = web.layout(winform)

wb.html = /**
<html>
<body>
<head>
<style>

.file{
  text-align:left;
  overflow-x:hidden;//与下面两行联合使用
  white-space:nowrap;
  text-overflow:ellipsis;//长字符串显示为...
}
}

</style>
</head>
<body>
        
  <div style="text-align:center;">
    <input type="file" />
    <br />
    <input type="file" .file />
    <br />
    <input type="file" novalue="我是超级长的文件名我是超级长的文件名我是超级长的文件名我是超级长的文件名我是超级长的文件名我是超级长的文件名我是超级长的文件名" />
  </div>


</body>
</html>
**/


winform.show() 
win.loopMessage();

问题说明
1,当file控件外部标签的 文字对齐 不为左的时候file控件会随之改变
2,当导入超长文件名的文件时 会导致空间变形 可能会导致整个界面的布局改变 所以我把这种情况 用 省略号的方法表示了

input[type="file"]{
  text-align:left;
  overflow-x:hidden;//与下面两行联合使用
  white-space:nowrap;
  text-overflow:ellipsis;//长字符串显示为...
}

原文链接：https://bbs.aardio.com/forum.php?mod=viewthread&tid=7376&extra=page%3D7