nim_duilib(20)之即刻(1)
note
一个基于nim_duilib仿wechat的IM。
主界面
样式
美工差了。
布局
整体为水平布局,左边的深灰色区域(frame_left),右侧的light white区域(frame_right)。
右侧的区域(frame_right)分为垂直布局,其中,左侧红色用于显示好友列表,右侧绿色用于显示聊天对话框
global xml中定义
定义了一些控件的样式
<!--左侧窗口控件-->
<Class name="left_btn_portrait" tooltiptext="头像" height="36" width="36" margin="10,20,10,10" bkcolor="color_light_white1" normalimage="file='../left_frame/portrait_32X32.png'" />
<Class name="left_opt_msg" tooltiptext="消息" text="消息" height="36" width="36" margin="10,20,10,10" bkcolor="color_light_white1"
selectednormalimage="file='../public/button/btn_global_red_80x30_normal.png'"
selecteddisabledimage="file='../public/button/btn_global_red_80x30_normal.png' fade='30'"/>
<Class name="left_opt_contact" tooltiptext="联系人" text="联系人" height="36" width="36" margin="10,20,10,10" bkcolor="color_light_white1"
selectednormalimage="file='../public/button/btn_global_red_80x30_normal.png'"
selecteddisabledimage="file='../public/button/btn_global_red_80x30_normal.png' fade='30'"/>
<Class name="left_opt_file" tooltiptext="文件" text="文件" height="36" width="36" margin="10,20,10,10" bkcolor="color_light_white1"
selectednormalimage="file='../public/button/btn_global_red_80x30_normal.png'"
selecteddisabledimage="file='../public/button/btn_global_red_80x30_normal.png' fade='30'"/>
<Class name="left_btn_setting" tooltiptext="设置" height="36" width="36" margin="10,20,10,10" bkcolor="color_light_white1" normalimage="file='../left_frame/setting.png'" />
<!--中间窗体控件-->
<TextColor name="edit_tip" value="#ffa8a8a8"/>
<TextColor name="edit_bk_color" value="#ffd7d9d8"/>
<Class name="middle_rich_edit_search" bkcolor="edit_bk_color" font="system_14" multiline="false" promptmode="true" prompttext="搜索" promptcolor="edit_tip"/>
<Class name="middle_btn_add" font="system_16" bkcolor="color_light_white1"/>
frame_left
frame_left为垂直布局。 xml文件如下
<!--左侧的frame-->
<VBox class="frame_left" height ="stretch" width="60" >
<!--头像-->
<Button class="left_btn_portrait" />
<!--消息-->
<Option class = "left_opt_msg" group = "left_frame" />
<!--通讯录-->
<Option class = "left_opt_contact" group = "left_frame" />
<!--文件-->
<Option class = "left_opt_file" group = "left_frame" />
<Control />
<!--设置-->
<Button class = "left_btn_setting" />
</VBox>
frame_right
xml内容
<!--右侧的frame-->
<VBox class="frame_middle_vbox" height="stretch" width="stretch">
<!---->
<HBox width="stretch" height="55" >
<!--搜索-->
<HBox width="250" height="30" margin="0,20,0,20">
<Control name="search_icon" width="auto" height="auto" valign="center" margin="10,0,0,0" alpha="192"
bkimage="file='../frame_middle/icon_search_gray.png' "/>
<RichEdit class="middle_rich_edit_search" name="search_edit" height="auto" margin="8,0,10,0" valign="center" font="system_12" />
<Button class="middle_btn_top_del" name="clear_input" visible="false" valign="center" margin="0,0,10,0" />
<Button class="middle_btn_top_add" text="+" height="25" width="30" margin="0,0,10,10"/>
</HBox>
<!--标题-->
<Label text="1234567890abcdefghijklmpqrstuvwxyz" font="system_16" margin="10,20,0,0"/>
<Control />
<!--右上角3个按钮-->
<Button class="btn_wnd_min" name="minbtn" margin="4,6,0,0" />
<Box width="21" margin="4,6,0,0">
<Button class="btn_wnd_max" name="maxbtn" />
<Button class="btn_wnd_restore" name="restorebtn" visible="false"/>
</Box>
<Button class="btn_wnd_close" name="closebtn" margin="4,6,8,0"/>
</HBox>
<!--右侧:联系人列表和聊天框-->
<HBox>
<!--联系人列表-->
<VBox bkcolor="red" width="250" height="stretch">
</VBox>
<!--聊天对话框-->
<VBox bkcolor="green" width="stretch" height="stretch">
</VBox>
</HBox>
</VBox>
xml完整
<?xml version="1.0" encoding="UTF-8"?>
<Window mininfo="700, 500" size="700,500" caption="0,0,0,500" shadowattached="true" sizebox="4,5,5,5" >
<HBox bkcolor="color_light_white1" height="stretch" width="stretch">
<!--左侧的frame-->
<VBox class="frame_left_vbox" height ="stretch" width="60" >
<!--头像-->
<Button class="left_btn_portrait" />
<!--消息-->
<Option class="left_opt_msg" group = "left_frame" />
<!--通讯录-->
<Option class="left_opt_contact" group = "left_frame" />
<!--文件-->
<Option class="left_opt_file" group = "left_frame" />
<Control />
<!--设置-->
<Button class="left_btn_setting" />
</VBox>
<!--右侧的frame-->
<VBox class="frame_middle_vbox" height="stretch" width="stretch">
<!---->
<HBox width="stretch" height="55" >
<!--搜索-->
<HBox width="250" height="30" margin="0,20,0,20">
<Control name="search_icon" width="auto" height="auto" valign="center" margin="10,0,0,0" alpha="192"
bkimage="file='../frame_middle/icon_search_gray.png' "/>
<RichEdit class="middle_rich_edit_search" name="search_edit" height="auto" margin="8,0,10,0" valign="center" font="system_12" />
<Button class="middle_btn_top_del" name="clear_input" visible="false" valign="center" margin="0,0,10,0" />
<Button class="middle_btn_top_add" text="+" height="25" width="30" margin="0,0,10,10"/>
</HBox>
<!--标题-->
<Label text="1234567890abcdefghijklmpqrstuvwxyz" font="system_16" margin="10,20,0,0"/>
<Control />
<!--右上角3个按钮-->
<Button class="btn_wnd_min" name="minbtn" margin="4,6,0,0" />
<Box width="21" margin="4,6,0,0">
<Button class="btn_wnd_max" name="maxbtn" />
<Button class="btn_wnd_restore" name="restorebtn" visible="false"/>
</Box>
<Button class="btn_wnd_close" name="closebtn" margin="4,6,8,0"/>
</HBox>
<!--右侧:联系人列表和聊天框-->
<HBox>
<!--联系人列表-->
<VBox bkcolor="red" width="250" height="stretch">
</VBox>
<!--聊天对话框-->
<VBox bkcolor="green" width="stretch" height="stretch">
</VBox>
</HBox>
</VBox>
</HBox>
</Window>
nim_duilib(20)之即刻(1)的更多相关文章
- IntelliJ IDEA 的 20 个代码自动完成的特性
http://www.oschina.net/question/12_70799 在这篇文章中,我想向您展示 IntelliJ IDEA 中最棒的 20 个代码自动完成的特性,可让 Java 编码变得 ...
- 总结swift语言常见的20个问题和回答
1.假设我是个刚入门的iOS开发人员,选swift学习呢,还是选objective-c学习,还是两个都学? 这个能够依据两种情况来决定:1.我想进入公司担任iOS开发的职位 2.我仅仅想做个独立 ...
- 【IDEA&&Eclipse】3、IntelliJ IDEA 的 20 个代码自动完成的特性
在这篇文章中,我想向您展示 IntelliJ IDEA 中最棒的 20 个代码自动完成的特性,可让 Java 编码变得更加高效.对任何集成开发环境来说,代码的自动完成都是最最重要的一项功能,它根据你输 ...
- 20个实用的javascript技巧及实践(一)
在本篇文章中,我们将会向大家分享JavaScript开发中的小技巧.最佳实践和实用内容,不管你是前端开发者还是服务端开发者,都应该来看看这些编程的技巧总结,绝对会让你受益匪浅的. 文中所提供的代码片段 ...
- 仿即刻app"猜你喜欢"切换控件
最近在即刻里看到即刻的"猜你喜欢"的板块,觉得效果很赞. 当点击"换一换"时,上面三个条目程序切换效果,并且三个条目的切换以不同的速度进行. 于是开始想办法撸出 ...
- C++代码优化之nim_duilib控件关联
前言 使用nim_duilib关联控件,优化后.的确减少了代码量,那么,执行效率呢? 时间执行的长短与硬件.软件有关,以下内容仅为参考. 测试代码 下面的代码,分为两部分, 循环使用for,非循环则直 ...
- nim_duilib(13)之添加fmt库
introduction 习惯使用fmt库做字符串的格式化操作.尽管nim_duilib提供了类似的函数. 故项目demo_xml引入了外部库fmt framework.h中添加下面的以便使用fmt库 ...
- nim_duilib(1)之第一个dui executable(including configure setting in vs2017)
before starting clone nim_duilib: https://github.com/netease-im/NIM_Duilib_Framework 迁出github的源码即可. ...
- CSharpGL(20)用unProject和Project实现鼠标拖拽图元
CSharpGL(20)用unProject和Project实现鼠标拖拽图元 效果图 例如,你可以把Big Dipper这个模型拽成下面这个样子. 配合旋转,还可以继续拖拽成这样. 当然,能拖拽的不只 ...
随机推荐
- 洛谷 P3270 - [JLOI2016]成绩比较(容斥原理+组合数学+拉格朗日插值)
题面传送门 考虑容斥.我们记 \(a_i\) 为钦定 \(i\) 个人被 B 神碾压的方案数,如果我们已经求出了 \(a_i\) 那么一遍二项式反演即可求出答案,即 \(ans=\sum\limits ...
- Codeforces 611H - New Year and Forgotten Tree(二分图多重匹配)
Codeforces 题目传送门 & 洛谷题目传送门 首先我们将所有十进制下位数相同的点看作一种颜色,这样题目转化为,给定 \(m\le 6\) 种颜色.每种颜色的点的个数 \(b_i\) 以 ...
- echo 输出彩色字符
借助echo的-e选项来实现,语法格式为 echo -e "\033[3xmsome things you want to print out.\033[0m" \033[3xm为 ...
- 如何使用csapp文件
深入理解操作系统中有个csapp.h的头文件 以下来介绍下如何使用它: 该头文件下载地址为http://download.csdn.net/detail/tzasd89812/4206284 在Ubu ...
- 42-Remove Nth Node From End of List
Remove Nth Node From End of List My Submissions QuestionEditorial Solution Total Accepted: 106592 To ...
- android studio 编译 Android dependency has different version
找了一圈,终于在大佬的博客中找到了解决方法. 附链接:https://blog.csdn.net/u010725171/article/details/81232183 Android depende ...
- 学习java 7.16
学习内容: 线程安全的类 Lock锁 生产者消费者模式 Object类的等待唤醒方法 明天内容: 网络编程 通信程序 遇到问题: 无
- Hadoop【MR开发规范、序列化】
Hadoop[MR开发规范.序列化] 目录 Hadoop[MR开发规范.序列化] 一.MapReduce编程规范 1.Mapper阶段 2.Reducer阶段 3.Driver阶段 二.WordCou ...
- 【JavaWeb安全】RMI-Remote Method Invocator
RMI-Remote Method Invocator 什么是RMI?RMI有什么用? RMI允许用户通过数据传输,调用远程方法,在远程服务器处理数据.例如将1,3传到远程服务器的加法运算器,加法运算 ...
- SSH服务及通过SSH方式登录linux
SSH服务及通过SSH方式登录linux 1.检查SSH服务转自:[1]Linux之sshd服务https://www.cnblogs.com/uthnb/p/9367875.html[2]Linux ...