C++拾趣——绘制Console中Check Box

news2024/11/28 20:44:52

大纲

  • 居中显示窗口
  • 清屏并重设光标
  • 绘制窗口
    • 绘制窗口顶部
    • 绘制复选项
    • 绘制按钮行
    • 绘制窗口底部
  • 修改终端默认行为
  • 对方向键的特殊处理
  • 过程控制
    • Tab键的处理
    • Enter键的处理
    • 上下左右方向键的处理
  • 完整代码
  • 代码地址

这次我们要绘制复选框,如下图。
在这里插入图片描述

居中显示窗口

按照界面库的设计,Check Box不能独立存在,而是要位于一个窗口中。我们就用线段画出一个窗口。

这个窗口要位于终端中间,即居中。这样我们就需要先获取终端窗口的尺寸。

    // 获取终端窗口大小
    struct winsize w;
    ioctl(STDIN_FILENO, TIOCGWINSZ, &w);
    int terminalWidth = w.ws_col;
    int terminalHeight = w.ws_row;

然后通过当前窗口的大小,计算出起始绘制的坐标。下面options里保存的是可供选择的单选项,窗口的高度会随着选项个数而变化。

    // 窗口的宽度和高度
    int windowWidth = 40;
    int windowHeight = options.size() + 8;

    // 计算窗口的起始位置
    int startX = (terminalWidth - windowWidth) / 2;
    int startY = (terminalHeight - windowHeight) / 2;

清屏并重设光标

在开始绘制之前,我们需要使用《C++拾趣——绘制Console中圆形进度》中介绍的\033[2J\033[H来清屏并将光标移动到左上角。这是我们需要反复从最开始的位置重新绘制所有内容。

    cout << "\033[2J\033[H"; // 清屏并将光标移动到左上角

绘制窗口

绘制窗口顶部

在这里插入图片描述

因为要居中,所以在Y轴方向,我们先要输出一些\n来换行。

    // 打印顶部边框
    cout << string(startY, '\n');
    cout << string(startX, ' ') << "+" << string(windowWidth - 2, '-') << "+" << endl;

绘制复选项

在这里插入图片描述

如果当前选中的不是底部PushButton,而是这些复选框选项,那么如果某个选项被聚焦,则在其前面使用>做标记。

    for (int i = 0; i < options.size(); ++i) {
        cout << string(startX, ' ') << "| ";
        cout << redBackground << whiteText; // 设置红色背景和白色字体
        if (i == selected && !isButtonSelected) {
            cout << "> "; // 用于指示当前选中的选项
        } else {
            cout << "  ";
        }
        cout << options[i] << string(windowWidth - 6 - options[i].size(), ' ') << reset << " |" << endl;
    }

绘制按钮行

在这里插入图片描述

我们需要绘制两个按钮:OK和Cancel。

因为按钮也要居中显示,所以我们先需要算出要空出多少列出来——padding值。

当按钮被选中时,它会变成绿色背景,另外一个按钮就会变成默认背景。

    // 打印按钮行
    string okButton = "[ OK ]";
    string cancelButton = "[Cancel]";
    int totalButtonLength = okButton.length() + cancelButton.length() + 2; // 2 spaces between buttons
    int padding = (windowWidth - totalButtonLength) / 2;

    cout << string(startX, ' ') << "| " << string(padding, ' ');
    if (isButtonSelected && buttonIndex == 0) {
        cout << greenBackground << whiteText << blinkText << okButton << reset;
    } else {
        cout << okButton;
    }
    cout << "  ";
    if (isButtonSelected && buttonIndex == 1) {
        cout << greenBackground << whiteText << blinkText << cancelButton << reset;
    } else {
        cout << cancelButton;
    }
    cout << string(windowWidth - totalButtonLength - padding - 4, ' ') << " |" << endl;

绘制窗口底部

在这里插入图片描述

    // 打印底部边框
    cout << string(startX, ' ') << "+" << string(windowWidth - 2, '-') << "+" << endl;

修改终端默认行为

由于不能鼠标操作,所以我们只能通过键盘操作界面,比如进行Button的选择和按下操作。

我们只接受Tab、向左、向右、向上、向下、ESC和Enter等7个键。

Tab键可以在Check Box和Push Button之间切换;

向左、向右只能在Push Button间切换;

向上、向下只能在Check Box间切换;

ESC是退出程序;

Enter表示PushButton被按下,或者Check Box被选中。

默认情况下,我们在键盘上输出的可见字符都会显示在终端上。但是在当前场景下,我们并不希望有这样的效果。这就需要我们修改终端的默认行为。

下面的代码在将终端修改为静默模式(关闭规范模式(ICANON)和回显(ECHO),使得输入字符不需要按下回车键就能立即读取,并且输入的字符不会显示在终端上)后,等待并读取键盘的输入,然后再还原原始的设置。这步还原操作非常重要,否则程序退出后,终端会一直处于静默模式,后续的输入都不会显示在终端上。这也预示着,如果本程序使用ctrl+c强行终止,会出现终端行为异常的情况。

int getch() {
    struct termios oldt, newt;
    int ch;
    tcgetattr(STDIN_FILENO, &oldt);
    newt = oldt;
    newt.c_lflag &= ~(ICANON | ECHO);   // 修改终端设置:关闭回显和规范模式
    tcsetattr(STDIN_FILENO, TCSANOW, &newt);    // 设置终端为静默模式
    ch = getchar();
    ……
    tcsetattr(STDIN_FILENO, TCSANOW, &oldt);
    return ch;
}

对方向键的特殊处理

在终端环境中,特殊键(如箭头键、功能键等)通常不会直接生成单个字符的输入,而是生成一系列字符的序列。对于箭头键,通常的序列是以 ESC 键(ASCII 码 27)开头,后面跟着一个或多个字符来表示具体的键。

  • 向上箭头:ESC + [ + A
  • 向下箭头:ESC + [ + B
  • 向右箭头:ESC + [ + C
  • 向左箭头:ESC + [ + D
    ch = getchar();
    if (ch == 27) { // 如果是ESC键
        ch = getchar();
        if (ch == 91) { // 如果是'['键
            ch = getchar();
            if (ch == 65) ch = 1000; // 上箭头键
            if (ch == 66) ch = 1001; // 下箭头键
            if (ch == 67) ch = 1002; // 右箭头键
            if (ch == 68) ch = 1003; // 左箭头键
        }
    }

过程控制

下面代码会在getch()中等待终端的输入。

int main() {
    vector<string> options = {"Option 1 [ ]", "Option 2 [ ]", "Option 3 [ ]"};
    int selected = 0;
    bool isButtonSelected = false;
    int buttonIndex = 0;

    while (true) {
        printMenu(options, selected, isButtonSelected, buttonIndex);

        int ch = getch();
        if (ch == 9) { // Tab 键
            if (isButtonSelected) {
                if (buttonIndex == 1) {
                    isButtonSelected = false;
                    selected = 0;
                } else {
                    buttonIndex = (buttonIndex + 1) % 2;
                }
            } else {
                if (selected == options.size() - 1) {
                    isButtonSelected = true;
                    buttonIndex = 0;
                } else {
                    selected = (selected + 1) % options.size();
                }
            }
        } else if (ch == 10 || ch == 13) { // Enter 键
            if (isButtonSelected) {
                if (buttonIndex == 0) { // OK 按钮
                    cout << "Selected options: ";
                    for (const auto& option : options) {
                        if (option[option.size() - 2] == 'X') {
                            cout << option << " ";
                        }
                    }
                    cout << endl;
                    break;
                } else if (buttonIndex == 1) { // Cancel 按钮
                    break;
                }
            } else {
                if (options[selected][options[selected].size() - 2] == 'X') {
                    options[selected][options[selected].size() - 2] = ' ';
                } else {
                    options[selected][options[selected].size() - 2] = 'X';
                }
            }
        }  else if (ch == 1000) { // 上箭头键
            if (!isButtonSelected) {
                selected = (selected - 1 + options.size()) % options.size();
            }
        } else if (ch == 1001) { // 下箭头键
            if (!isButtonSelected) {
                selected = (selected + 1) % options.size();
            }
        } else if (ch == 1002) { // 右箭头键
            if (isButtonSelected) {
                buttonIndex = (buttonIndex + 1) % 2;
            }
        } else if (ch == 1003) { // 左箭头键
            if (isButtonSelected) {
                buttonIndex = (buttonIndex + 1) % 2;
            }
        } else if (ch == 27) { // Esc 键退出
            break;
        }
    }

    return 0;
}

Tab键的处理

该界面分为两个区域:Check Box区域和Push Button区域。isButtonSelected变量表示当前焦点是否在Push Button区域。

如果是Push Button区域(isButtonSelected == true),且当前聚焦的是Cancel(buttonIndex == 1),则在收到Tab键时,会跳到Check Box区域(isButtonSelected = false)的第一个选项(selected = 0);如果聚焦的不是Cancel,则通过buttonIndex = (buttonIndex + 1) % 2计算出要聚焦到的Push Button的下标。

如果是Check Box区域(isButtonSelected == false),且当前聚焦的是最后一个Check Box,则在收到Tab键时,会跳到Push Button区域(isButtonSelected = true),并聚焦到OK上(buttonIndex = 0);如果聚焦的不是最后一个Check Box,则通过selected = (selected + 1) % options.size()计算出要聚焦到的Check Box的下标。

在这里插入图片描述

Enter键的处理

如果当前聚焦的是Push Button区域(isButtonSelected == true),则判断聚焦的是OK还是Cancel。如果是OK,则输出用户的选项并退出;如果是Cancel则直接退出。

如果当前聚焦的是Check Box区域(isButtonSelected == false),则会根据当前聚焦项目状态决定将其变成被选中状态(X)还是未选中状态(空格)。

在这里插入图片描述

上下左右方向键的处理

我们让上下键只能在Check Box区域切换焦点,左右键只能在Push Button区域切换焦点。这是因为Check Box区域中的项目是上下布局的,而Push Button区域是左右布局的。
在这里插入图片描述

在这里插入图片描述

完整代码

#include <iostream>
#include <vector>
#include <termios.h>
#include <unistd.h>
#include <sys/ioctl.h>

using namespace std;

void display(const vector<string>& options, int selected, bool isButtonSelected, int buttonIndex) {
    const string redBackground = "\033[41m"; // 红色背景
    const string greenBackground = "\033[42m"; // 绿色背景
    const string whiteText = "\033[37m";     // 白色字体
    const string blinkText = "\033[5m";      // 闪烁文本
    const string reset = "\033[0m";          // 重置颜色

    // 获取终端窗口大小
    struct winsize w;
    ioctl(STDIN_FILENO, TIOCGWINSZ, &w);
    int terminalWidth = w.ws_col;
    int terminalHeight = w.ws_row;

    // 窗口的宽度和高度
    int windowWidth = 40;
    int windowHeight = options.size() + 8;

    // 计算窗口的起始位置
    int startX = (terminalWidth - windowWidth) / 2;
    int startY = (terminalHeight - windowHeight) / 2;

    cout << "\033[2J\033[H"; // 清屏并将光标移动到左上角

    // 打印顶部边框
    cout << string(startY, '\n');
    cout << string(startX, ' ') << "+" << string(windowWidth - 2, '-') << "+" << endl;

    for (int i = 0; i < options.size(); ++i) {
        cout << string(startX, ' ') << "| ";
        cout << redBackground << whiteText; // 设置红色背景和白色字体
        if (i == selected && !isButtonSelected) {
            cout << "> "; // 用于指示当前选中的选项
        } else {
            cout << "  ";
        }
        cout << options[i] << string(windowWidth - 6 - options[i].size(), ' ') << reset << " |" << endl;
    }

    // 打印按钮行
    string okButton = "[ OK ]";
    string cancelButton = "[Cancel]";
    int totalButtonLength = okButton.length() + cancelButton.length() + 2; // 2 spaces between buttons
    int padding = (windowWidth - totalButtonLength) / 2;

    cout << string(startX, ' ') << "| " << string(padding, ' ');
    if (isButtonSelected && buttonIndex == 0) {
        cout << greenBackground << whiteText << blinkText << okButton << reset;
    } else {
        cout << okButton;
    }
    cout << "  ";
    if (isButtonSelected && buttonIndex == 1) {
        cout << greenBackground << whiteText << blinkText << cancelButton << reset;
    } else {
        cout << cancelButton;
    }
    cout << string(windowWidth - totalButtonLength - padding - 4, ' ') << " |" << endl;

    // 打印底部边框
    cout << string(startX, ' ') << "+" << string(windowWidth - 2, '-') << "+" << endl;

    cout << reset; // 重置颜色
}

int getch() {
    struct termios oldt, newt;
    int ch;
    tcgetattr(STDIN_FILENO, &oldt);
    newt = oldt;
    newt.c_lflag &= ~(ICANON | ECHO);
    tcsetattr(STDIN_FILENO, TCSANOW, &newt);
    ch = getchar();
    if (ch == 27) { // 如果是ESC键
        ch = getchar();
        if (ch == 91) { // 如果是'['键
            ch = getchar();
            if (ch == 65) ch = 1000; // 上箭头键
            if (ch == 66) ch = 1001; // 下箭头键
            if (ch == 67) ch = 1002; // 右箭头键
            if (ch == 68) ch = 1003; // 左箭头键
        }
    }
    tcsetattr(STDIN_FILENO, TCSANOW, &oldt);
    return ch;
}

int main() {
    vector<string> options = {"Option 1 [ ]", "Option 2 [ ]", "Option 3 [ ]"};
    int selected = 0;
    bool isButtonSelected = false;
    int buttonIndex = 0;

    while (true) {
        display(options, selected, isButtonSelected, buttonIndex);

        int ch = getch();
        if (ch == 9) { // Tab 键
            if (isButtonSelected) {
                if (buttonIndex == 1) {
                    isButtonSelected = false;
                    selected = 0;
                } else {
                    buttonIndex = (buttonIndex + 1) % 2;
                }
            } else {
                if (selected == options.size() - 1) {
                    isButtonSelected = true;
                    buttonIndex = 0;
                } else {
                    selected = (selected + 1) % options.size();
                }
            }
        } else if (ch == 10 || ch == 13) { // Enter 键
            if (isButtonSelected) {
                if (buttonIndex == 0) { // OK 按钮
                    cout << "Selected options: ";
                    for (const auto& option : options) {
                        if (option[option.size() - 2] == 'X') {
                            cout << option << " ";
                        }
                    }
                    cout << endl;
                    break;
                } else if (buttonIndex == 1) { // Cancel 按钮
                    break;
                }
            } else {
                if (options[selected][options[selected].size() - 2] == 'X') {
                    options[selected][options[selected].size() - 2] = ' ';
                } else {
                    options[selected][options[selected].size() - 2] = 'X';
                }
            }
        }  else if (ch == 1000) { // 上箭头键
            if (!isButtonSelected) {
                selected = (selected - 1 + options.size()) % options.size();
            }
        } else if (ch == 1001) { // 下箭头键
            if (!isButtonSelected) {
                selected = (selected + 1) % options.size();
            }
        } else if (ch == 1002) { // 右箭头键
            if (isButtonSelected) {
                buttonIndex = (buttonIndex + 1) % 2;
            }
        } else if (ch == 1003) { // 左箭头键
            if (isButtonSelected) {
                buttonIndex = (buttonIndex + 1) % 2;
            }
        } else if (ch == 27) { // Esc 键退出
            break;
        }
    }

    return 0;
}

代码地址

https://github.com/f304646673/cpulsplus/tree/master/console_ui/checkbox

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/2189374.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

网约班车升级手机端退票

背景 作为老古董程序员&#xff0c;不&#xff0c;应该叫互联网人员&#xff0c;因为我现在做的所有的事情&#xff0c;都是处于爱好&#xff0c;更多的时间是在和各行各业的朋友聊市场&#xff0c;聊需求&#xff0c;聊怎么通过IT互联网 改变实体行业的现状&#xff0c;准确的…

ExcelToWord-Excel套打Word-Word邮件合并工具分享

Excel to Word转换工具分享 在日常工作或学习中&#xff0c;我们常常需要将Excel中的数据导出到Word文档中&#xff0c;以便更好地展示信息。市场上有许多Excel to Word的转换工具&#xff0c;它们各有特色。今天&#xff0c;我们就来推荐几款这样的工具&#xff0c;并探讨一下…

如何使用虚拟机充当软路由

文章目录 前言下载系统把 iso 转为虚拟机使用 VMware 创建虚拟机 前言 很多人需要软路由&#xff0c;但是软路由需要设备的投入&#xff0c;我这里使用虚拟机充当软路由。省下了设备的投入。不过多花了电费。大家自己取舍吧。 下载系统 ImmortalWrt Firmware Selector 在上…

蓝桥等级考试C++组18级真题-2023-06-18

选择题 1 C L18(15分) 已定义double rate 3.921576&#xff1b;以下可以正确输出变量rate 的是()。 A printf("%d",rate)&#xff1b; B printf("%f",rate)&#xff1b; C printf("%ld",rate)&#xff1b; D printf("%r",rate)&#…

PhpStudy-PHP5.4.45后门漏洞应用程序(C++/base64/winhttp)

PhpStudy-PHP5.4.45后门漏洞应用程序&#xff08;C/base64/winhttp&#xff09; 前言引言&#xff08;时间回到多年前&#xff09; PhpShellCmd.exe使用介绍&#xff1a;&#xff08;1&#xff09;输入网址检测是否存在PHP/5.4.45&#xff08;2&#xff09;whoami&#xff08;3…

新闻推荐系统:Spring Boot与大数据

4系统概要设计 4.1概述 本系统采用B/S结构(Browser/Server,浏览器/服务器结构)和基于Web服务两种模式&#xff0c;是一个适用于Internet环境下的模型结构。只要用户能连上Internet,便可以在任何时间、任何地点使用。系统工作原理图如图4-1所示&#xff1a; 图4-1系统工作原理…

IP协议报文

一.IP协议报头结构 二.IP协议报头拆解 1.4位版本 实际上只有两个取值&#xff0c;分别是4和6&#xff0c;4代表的是IPv4&#xff0c;6代表的是IPv6。 2.4位首部长度 IP协议报头的长度也是边长的&#xff0c;单位是*4&#xff0c;这里表示的大小为0~15&#xff0c;当数值为1…

昇思学习打卡营第31天|深度解密 CycleGAN 图像风格迁移:从草图到线稿的无缝转化

1. 简介 图像风格迁移是计算机视觉领域中的一个热门研究方向&#xff0c;其中 CycleGAN (循环对抗生成网络) 在无监督领域取得了显著的突破。与传统需要成对训练数据的模型如 Pix2Pix 不同&#xff0c;CycleGAN 不需要严格的成对数据&#xff0c;只需两类图片域数据&#xff0c…

【redis学习篇1】redis基本常用命令

目录 redis存储数据的模式 常用基本命令 一、set 二、keys pattern keys 字符串当中携带问号 keys 字符串当中携带*号 keys 【^字母】 keys * 三、exists 四、del 五、expire 5.1 ttl命令 5.2key删除策略 5.2.1惰性删除 5.2.2定期删除 六、type key的数据类型…

数据结构--线性表(顺序结构)

1.线性表的定义和基本操作 1.1线性表以及基本逻辑 1.1.1线性表 &#xff08;1&#xff09;n(>0)个数据元素的有限序列&#xff0c;记作&#xff08;a1,a2,...an&#xff09;&#xff0c;其中ai是线性表中的数据元素&#xff0c;n是表的长度。 &#xff08;2&#xff09;…

【RabbitMQ】RabbitMQ学习

1. 发送流程 生产者 - connection - channel - 交换机 - 对列- channel - connection - 消费者 2. 工作模式 2.1. 简单模式&#xff08;点对点&#xff09; 一个消费者一个生产者&#xff0c;直接进行通信。 2.2. 工作对列模式 多个消费者共同消费消息对列中的消息。同一条…

10其他内容补充

如何生成随机数原理详细分析 文章目录 如何生成随机数原理详细分析原理如果使用相同的随机数种子,得到的随机数序列会是相同的吗示例为什么需要随机数种子 动态内存管理前言malloc函数calloc函数realloc函数free函数 - 避免内存泄漏常见的动态内存错误 原理 说到如何生成一个随…

实现TCP Connect的断线重连机制:策略与实践

&#x1f351;个人主页&#xff1a;Jupiter. &#x1f680; 所属专栏&#xff1a;Linux从入门到进阶 欢迎大家点赞收藏评论&#x1f60a; 断线重连机制&#xff0c;它成为确保应用在网络不稳定情况下仍能持续提供服务的关键技术之一。本文旨在深入探讨TCP&#xff08;传输控制协…

浅聊前后端分离开发和前后端不分离开发模式

1.先聊聊Web开发的开发框架Spring MVC 首先要知道&#xff0c;Spring MVC是Web开发领域的一个知名框架&#xff0c;可以开发基于请求-响应模式的Web应用。而Web开发的本质是遵循HTTP&#xff08;Hyper Text Transfer Protocol: 超文本传输协议&#xff09;协议【发请求&#xf…

仿RabbitMQ实现消息队列客户端

文章目录 客⼾端模块实现订阅者模块信道管理模块异步⼯作线程实现连接管理模块生产者客户端消费者客户端 客⼾端模块实现 在RabbitMQ中&#xff0c;提供服务的是信道&#xff0c;因此在客⼾端的实现中&#xff0c;弱化了Client客⼾端的概念&#xff0c;也就是说在RabbitMQ中并…

V2M2引擎源码BlueCodePXL源码完整版

V2M2引擎源码BlueCodePXL源码完整版 链接: https://pan.baidu.com/s/1ifcTHAxcbD2CyY7gDWRVzQ?pwdmt4g 提取码: mt4g 参考资料&#xff1a;BlueCodePXL源码完整版_1234FCOM专注游戏工具及源码例子分享

图解大模型计算加速系列:vLLM源码解析3,块管理器(BlockManager)上篇

vllm块管理器又分成朴素块管理器&#xff08;UncachedBlockAllocator&#xff09;和prefix caching型块管理器&#xff08;CachedBlockAllocator&#xff09;。本篇我们先讲比较简单的前者&#xff0c;下篇我们来细看更有趣也是更难的后者。 【全文目录如下】 【1】前情提要…

阿里巴巴开源的FastJson 1反序列化漏洞复现攻击保姆级教程

免责申明 本文仅是用于学习检测自己搭建的靶场环境有关FastJson1反序列化漏洞的原理和攻击实验,请勿用在非法途径上,若将其用于非法目的,所造成的一切后果由您自行承担,产生的一切风险和后果与笔者无关;本文开始前请认真详细学习《‌中华人民共和国网络安全法》‌及其所在…

Linux高级编程_29_信号

文章目录 进程间通讯 - 信号信号完整的信号周期信号的编号信号的产生发送信号1 kill 函数(他杀)作用&#xff1a;语法&#xff1a;示例&#xff1a; 2 raise函数(自杀)作用&#xff1a;示例&#xff1a; 3 abort函数(自杀)作用&#xff1a;语法&#xff1a;示例&#xff1a; 4 …

macos安装git并连接gitCode远程仓库

文章目录 资料地址下载和安装初始化配置本地全局配置&#xff0c;SSH公私密钥生成远程SSH key配置 新建代码仓库&#xff0c;并关联到本地 资料地址 git官网地址gitCode地址 下载和安装 打开git官网地址&#xff0c;直接下载。【不建议使用brew&#xff0c;因为本人实践&…