换一种思路实现隐藏密码和显示密码

我心飞翔1995

        今天翻看帖子的的时候，看到不少关于密码框的简单说明，本来这种不是很难，就是编辑框开启密码属性。但我看还没有一篇关于显示密码功能实现的帖子，本着触类旁通的原则，便想基于aardio的易用性上，实现这个常见功能。
        首先，edit控件的密码属性是password，启用之后，该属性值为1，这个属性却不是可以修改的属性，属于设计属性，我第一次尝试通过代码修改该属性实现显示密码失败。
        然后，我想到了编辑框的隐藏属性，那个属性也是设计属性，不过可以通过show方法来改变。于是，思路就有了。
        创建两个编辑框，在同一个位置，分别启用和不启用密码属性，分别设为显示和隐藏，显示的是密码框，隐藏的是明文框。
        创建多选框，用于控制密码是否显示，通过检查多选框的checked属性，使密码框和明文框交替隐藏，同时传递框内的文本，做到无缝对接。这样，用两个编辑框就实现了密码的显示和隐藏。
        代码如下：

1. import win.ui;
   
2. /*DSG{{*/
   
3. mainForm = win.form(text="aardio form";right=519;bottom=189;border="dialog frame";max=false)
   
4. mainForm.add(
   
5. checkbox={cls="checkbox";text="显示密码";left=380;top=100;right=480;bottom=130;font=LOGFONT(h=-16);z=6};
   
6. edit={cls="edit";text="用户名";left=140;top=50;right=350;bottom=80;edge=1;font=LOGFONT(h=-16);z=1};
   
7. edit2={cls="edit";text="edit";left=140;top=100;right=350;bottom=130;edge=1;font=LOGFONT(h=-16);password=1;z=2};
   
8. edit3={cls="edit";text="edit";left=140;top=100;right=350;bottom=130;edge=1;font=LOGFONT(h=-16);hide=1;multiline=1;z=3};
   
9. static={cls="static";text="用户名：";left=50;top=50;right=130;bottom=80;font=LOGFONT(h=-16);transparent=1;z=4};
   
10. static2={cls="static";text="密码：";left=50;top=100;right=130;bottom=130;font=LOGFONT(h=-16);transparent=1;z=5}
    
11. )
    
12. /*}}*/
    
13. 
    
14. mainForm.checkbox.oncommand = function(id,event){
    
15.         var cb=mainForm.checkbox;
    
16.         var e1=mainForm.edit2;
    
17.         var e2=mainForm.edit3;
    
18.         if(cb.checked){
    
19.                 e1.show(false);
    
20.                 e2.show(true);
    
21.                 e2.text=e1.text;
    
22.         }
    
23.         else{
    
24.                 e2.show(false);
    
25.                 e1.show(true);
    
26.                 e1.text=e2.text;
    
27.         }
    
28. }
    
29. 
    
30. mainForm.enableDpiScaling();
    
31. mainForm.show();
    
32. return win.loopMessage();
    

复制代码

松江

import win.ui;
/*DSG{{*/
var winform = win.form(text="aardio form";right=386;bottom=125)
winform.add(
button={cls="button";text="显  示";left=82;top=56;right=180;bottom=101;z=1};
button2={cls="button";text="还原成为密码框";left=232;top=56;right=330;bottom=101;z=3};
edtPassword={cls="edit";text="我是一些文字";left=64;top=23;right=357;bottom=48;edge=1;font=LOGFONT(h=-16);z=2}
)
/*}}*/

::SendMessageInt(winform.edtPassword.hwnd, 0xCC/*_EM_SETPASSWORDCHAR*/, '*'#,0)
winform.button2.oncommand = function(id, event) {
    ::SendMessageInt(winform.edtPassword.hwnd, 0xCC/*_EM_SETPASSWORDCHAR*/, '*'#,0)
    winform.edtPassword.setFocus()
}

winform.button.oncommand = function(id, event) {
    ::SendMessageInt(winform.edtPassword.hwnd, 0xCC/*_EM_SETPASSWORDCHAR*/, 0, 0)
    winform.edtPassword.setFocus()
}

winform.show();
win.loopMessage();

popdes

楼主的方式可以用窗口探测器直接读出密码......不可取

我心飞翔1995

popdes 发表于 2018-3-19 22:46
楼主的方式可以用窗口探测器直接读出密码......不可取

我试了一下，的确是，不过二楼的代码也能抓取到密码文本

JacenHe

文本框的密码都是可以用工具抓到的，

能自己想办法解决问题，这非常好，两个控件放在同一个位置，相互切换显示状态，这个方法其实很多地方可以用到。
不过单纯说你那个函数可以再改进一下，例如：

mainForm.checkbox.oncommand = function(id,event){
    var a,b = mainForm.editPassword2,mainForm.editPassword;
    if( mainForm.checkbox.checked ) a,b = b,a;
    a.show(false);
    b.show(true);
    b.text=a.text;
}

当然，每次都要拖2个控件，还要放同一个位置，这都可以用代码自己动来完成这些工作，

例如，写一个库 password.buddy

namespace password;
   
class buddy{
   
    ctor( ctrl ){
        if(ctrl.buddy) return ctrl.buddy;
        
        this = ctrl.parent.addCtrl({ {  cls=ctrl.cls;edge=ctrl.edge;autoResize=false } } )[1];
        
        this.oncommand = function(id,event){
            if( event == 0x300/*_EN_CHANGE*/ ){
                ctrl.text = ctrl.buddy.text;
            }
        }
        
        ctrl.adjust = function(){
            var x,y,cx,cy = ctrl.getPos();
            this.setPos(x,y,cx,cy);
        }
        
        ctrl.adjust();
        
        this.showPassword = function(s){
            var a,b = this,ctrl;
            if(s) a,b = b,a;
            a.show(false);
            b.show(true);
            b.text=a.text;
        }
        
        ctrl.buddy = this;
    };
}

写库就是这个好，只要累一次，以后用的时候就简单了，只要写几句就可以了：

import password.buddy;
var pwdBuddy = password.buddy(mainForm.editPassword)

mainForm.checkbox.oncommand = function(id,event){
    pwdBuddy.showPassword( mainForm.checkbox.checked )  
}

当然，即然有 EM_SETPASSWORDCHAR 就不用自己写这么多代码了，
但自己动手、丰衣足食的精神，我们还是要多多发扬的，不能总是指望别人写好现成的。

JacenHe

edit控件增加了passwordChar 属性
winform.edit.passwordChar = "*" 隐藏密码
winform.edit.passwordChar = null 显示密码

工具里的winspy增加了显示密码的功能。