这次更新的是一个关于使用SDL编写模拟电话拨号盘的程序。
下面先来描述一下这个程序需要实现的功能:
在这次的程序中,我们将要实现的功能是拨动拨号盘,在拨动期间会伴有拨号声音,并且在拨号完后会显示出号码。
下面是我们将要用到的一些图片资源:
这是我在网上找的一张图片,作为我们整个程序的原始图片,后面我们需要的图片要从它上面进行ps提取,首先我们要把它中间的那个圆盘给p下来,保存成一张透明的png图片,同样将那个黑色的卡条给p下来,保存成一张透明的png图片,这里我就不贴上来了,因为图片太大了,待会我会在文章最后附上我全部程序资源的百度云网址,供大家下载。
下面简要说一下此程序需要用到的技术:
1、对于如何加载窗口和进行事件响应的工作我在这里就不再说明了,如果有什么问题可以参考我的上一篇博客,里面有相关的说明。
2、我们首先来实现拨号的功能,也就是如何让中间的拨号盘可以转动起来。我这里使用的方法是用将中间的拨号盘的图片扣出来,做成一张周围透明的图片(这些图片的加载 需要用到SDL_Image库),覆盖在原始的电话机上,并使用这个抠出来的图片响应鼠标的拖动,以实现拨号的功能,这里面将会使用到一个函数SDL_RenderCopyEx,这个函数可以参照我的另一篇文章:http://blog.csdn.net/qq_29883591/article/details/52924047。
3、然后我们要实现拨号声音,这里面我们将会使用SDL_Mixer库,这个可以参照我的另一篇博客:http://blog.csdn.net/qq_29883591/article/details/52913658,对于我程序中用到的音乐只有不到1秒钟,所以在拨号期间我得记录时间间隔并重复播放音乐。
4、实现号码的展示,这里我偷了个懒,没有使用真实数字的展示,而是通过带数字的图片进行展示的,大家有兴趣的话可以自己去实现下真实的字。
下面直接上代码,里面有很清楚的注释:
#include<iostream> #include<SDL/SDL.h> #include<SDL/SDL_Image.h> #include<SDLSDL_mixer.h> #include<string> #include<time.h> #include<stdlib.h> #include<vector> using namespace std; SDL_Renderer *renderer = nullptr; SDL_Window *window = nullptr; const int SCREEN_WIDTH = 1000; const int SCREEN_HEIGHT = 668; //buttons用于记录电话盘上0到9的圆心坐标 const int buttons[10][10]={{692,551},{696,344},{641,334},{590,344},{552,378},{530,424},{530,475},{554,522},{592,552},{645,564}}; const int radius=20; //代表电话盘上圆心的半径 int phoneNumber[11]; //中国的号码最多11位 int index=0; //用于记录号码的个数 SDL_Texture *number[10]; //存放10个数字的图片 //此函数用于加载图片 SDL_Texture* LoadImage(std::string file); //此函数用于将纹理画到渲染器上 void ApplySurface(int x, int y, SDL_Texture *tex, SDL_Renderer *rend); //此函数用于判断鼠标是否按在了0到9这10个数字中的一个,如果是,则返回这个数字的值,否则返回-1 int check(int mouse_x,int mouse_y); //此函数用于计算两个向量之间的夹角,运用的是余弦定理和反余弦函数求角度 double calDegree(int x1,int y1,int x2,int y2); //计算第二个向量相对于第一个向量旋转的方向,用的是向量叉乘定理 bool direct(int x1,int y1,int x2,int y2); //此函数用于显示我们将要展示的图形界面 void show(SDL_Texture *phone,SDL_Texture *dialdial,SDL_Texture *button,int angle,SDL_Point center); //此函数用于加载十个数字 void initNumber(); //销毁十个数字的图片 void destroyNumber(); int main(int argc,char *argv) { if (SDL_Init(SDL_INIT_EVERYTHING) == -1){ std::cout << SDL_GetError() << std::endl; return 1; } window = SDL_CreateWindow("LightDemo", SDL_WINDOWPOS_CENTERED, SDL_WINDOWPOS_CENTERED, SCREEN_WIDTH, SCREEN_HEIGHT, SDL_WINDOW_SHOWN); //创建一个绘制图片的窗口 if (window == nullptr){ std::cout << SDL_GetError() << std::endl; return 2; } renderer = SDL_CreateRenderer(window, -1, SDL_RENDERER_ACCELERATED | SDL_RENDERER_PRESENTVSYNC); //创建一个指定到窗口的渲染器 if (renderer == nullptr){ std::cout << SDL_GetError() << std::endl; return 3; } SDL_Texture *phone = nullptr, *dial = nullptr,*button=nullptr; try { //用于加载电话机的整体图片 phone=LoadImage("phone.jpg"); //用于加载电话的拨号盘 dial = LoadImage("dial.png"); //用于加载拨号盘上的挂钩 button=LoadImage("button.png"); } catch (const std::runtime_error &e){ std::cout << e.what() << std::endl; return 4; } initNumber(); //加载0到9这10张图片 double angle=0; //angle代表旋转的角度 SDL_Point center; //center用于表示dial图片的圆心 center.x=644; center.y=448; //加载声音文件 Mix_OpenAudio(44100,MIX_DEFAULT_FORMAT,2,2048); Mix_Music *sound=Mix_LoadMUS("D://sound.wav"); time_t start,end=0; //用于标识时间的起始,在后面我们在配音的时候会用到 time_t timeDist=0; //此变量用于表示start和end的差值 SDL_Event e; bool quit=false; //用于标记用户是否想退出程序 bool mouseDown=false; //此变量用于指示鼠标是否一直按着没有松开 int downButton=-1; //此变量用于标识用户在拨动的号码 //下面两组变量用于存储两个不同时刻鼠标的位置 int mouse_x,mouse_y; int curMouse_x; int curMouse_y; bool flag; //flag用于标识拨号盘的号码键是否被成功拨到底端,成功拨号置为true,否则为false show(phone,dial,button,angle,center); while(!quit) { while(SDL_PollEvent(&e)) { switch(e.type) { //此种情况是退出程序用的,当你点击窗口的红X时就会关闭界面 case SDL_QUIT: quit=true; break; //此处处理的是鼠标按下事件 case SDL_MOUSEBUTTONDOWN: mouseDown=true; mouse_x=e.button.x; mouse_y=e.button.y; downButton=check(mouse_x,mouse_y); //记下当前鼠标按下的数字(当然也可能为-1,即没有按在数字上) show(phone,dial,button,angle,center); start=clock(); //记录下起始时间,以便播放声音 break; //鼠标弹起操作 case SDL_MOUSEBUTTONUP: while(angle>=0) //此时angle大于0则表示拨号盘被松开了且没有回到原位置,则动态展示拨号盘自动转回来的场景 { show(phone,dial,button,angle,center); angle-=2; //设置每次转动角度为2 end=clock(); //记录下时间 if(difftime(end,start)-timeDist>800) //当时间过了800毫秒时,重新播放音乐 { timeDist+=800; Mix_PlayMusic(sound,1); } } if(angle<=0) end=0; //当拨号盘转回到初始位置时,将结束时间清0 mouseDown=false; //记录下鼠标没有按下 timeDist=0; //时间间隔清0 break; //处理鼠标移动 case SDL_MOUSEMOTION: { //记录下鼠标移动过程中位置的坐标 curMouse_x=e.motion.x; curMouse_y=e.motion.y; if(mouseDown) //当鼠标按下去时,此时即是鼠标在拖动 { //此处的75+downButton*27是根据拨号盘中数字的位置计算每个数字可以被转动的角度,当到极限时不允许转动,此时即拨号成功 if(downButton!=-1&&angle<75+downButton*27) { if(end==0) //当拨号盘从初始位置转动时,播放音乐 Mix_PlayMusic(sound,1); end=clock(); //记录下时间,以便计算时间间隔 flag=false; int vec1_x=mouse_x-center.x; int vec1_y=mouse_y-center.y; int vec2_x=curMouse_x-center.x; int vec2_y=curMouse_y-center.y; if(direct(vec1_x,vec1_y,vec2_x,vec2_y)) //计算鼠标旋转的方向,顺时针时才可以拨动号码盘 angle+=calDegree(vec1_x,vec1_y,vec2_x,vec2_y); show(phone,dial,button,angle,center); //SDL_Delay(20); //将当前鼠标的位置赋值给记录前一次移动鼠标的位置,以便进行迭代 mouse_x=curMouse_x; mouse_y=curMouse_y; //当时间过了800毫秒时,重新播放音乐 if(difftime(end,start)-timeDist>800) { timeDist+=800; Mix_PlayMusic(sound,1); } } else if(!flag&&angle>75+downButton*27) //此时代表拨号成功 { flag=true; //将号码存储在数组中 if(downButton==10) //10代表的是数字0 phoneNumber[index]=0; else phoneNumber[index]=downButton; index++; //当号码的位数超过11位时,清空 if(index>=11) index=0; } } } break; //处理默认的操作 default: break; } } } SDL_DestroyTexture(phone); SDL_DestroyTexture(dial); SDL_DestroyTexture(button); SDL_DestroyRenderer(renderer); destroyNumber(); SDL_DestroyWindow(window); return 0; } //此函数用于加载十个数字 void initNumber() { number[0]=LoadImage("0.png"); number[1]=LoadImage("1.png"); number[2]=LoadImage("2.png"); number[3]=LoadImage("3.png"); number[4]=LoadImage("4.png"); number[5]=LoadImage("5.png"); number[6]=LoadImage("6.png"); number[7]=LoadImage("7.png"); number[8]=LoadImage("8.png"); number[9]=LoadImage("9.png"); } void destroyNumber() { for(int i=0;i<9;i++) { SDL_DestroyTexture(number[i]); } } //此函数用于加载图片 SDL_Texture* LoadImage(std::string file){ SDL_Texture* tex = nullptr; tex = IMG_LoadTexture(renderer, file.c_str()); if (tex == nullptr) throw std::runtime_error("Failed to load dial: " + file + IMG_GetError()); return tex; } //此函数用于将纹理画到渲染器上 void ApplySurface(int x, int y, SDL_Texture *tex, SDL_Renderer *rend) { SDL_Rect pos; //x,y是图片左上角的坐标 pos.x = x; pos.y = y; SDL_QueryTexture(tex, NULL, NULL, &pos.w, &pos.h); SDL_RenderCopy(rend, tex, NULL, &pos); //将纹理tex画到渲染器rend } //此函数用于判断鼠标是否按在了0到9这10个数字中的一个,如果是,则返回这个数字的值,否则返回-1 int check(int mouse_x,int mouse_y) { double dist; for(int i=0;i<10;i++) { //dist存储的值为鼠标到圆形数字圆心的距离 dist=sqrt(double((mouse_x-buttons[i][0])*(mouse_x-buttons[i][0])+(mouse_y-buttons[i][1])*(mouse_y-buttons[i][1]))); if(dist<=radius) //当距离小于半径时,则表示鼠标触碰到了数字 { if(i==0) //此处将0处理成10是为了后面旋转拨号时角度的处理方便 return 10; return i; } } return -1; } //此函数用于计算两个向量之间的夹角,运用的是余弦定理和反余弦函数求角度 double calDegree(int x1,int y1,int x2,int y2) { int n=x1*x2+y1*y2; double m=sqrt(double(x1*x1+y1*y1))*sqrt(double(x2*x2+y2*y2)); return acos(n/m)*180/3.14; } //计算第二个向量相对于第一个向量旋转的方向,用的是向量叉乘定理 bool direct(int x1,int y1,int x2,int y2) { int n=x1*y2-x2*y1; return n>=0; //n大于0表示顺时针,否则表示逆时针 } //此函数用于显示我们将要展示的图形界面 void show(SDL_Texture *phone,SDL_Texture *dialdial,SDL_Texture *button,int angle,SDL_Point center) { SDL_RenderClear(renderer); ApplySurface(0,0,phone,renderer); SDL_RenderCopyEx(renderer, dialdial, NULL, NULL, angle, ¢er, SDL_FLIP_NONE); //下面的循环用于在界面上显示拨打的号码 for(int i=0;i<index;i++) { ApplySurface(30+30*i,450,number[phoneNumber[i]],renderer); } SDL_RenderPresent(renderer); }
程序的所有相关资源放在了网盘,链接为:http://pan.baidu.com/s/1pLdF6BL。