本文主要是介绍用c语言编写前端开发中比例计算px转vw/vh的计算器，希望对大家解决编程问题提供一定的参考价值，需要的开发者们随着小编来一起学习吧！
用c语言编写前端开发中比例计算px转vw/vh的计算器
在写移动端页面的时候为了适配手机型号尺寸的变化，需要多次用到vw和vh相对单位。所以就自己用C语言写了一个简易版计算器。
实现功能有：
- wpx/hpx转vw/vh （wpx元素的宽度，hpx元素的高度。本文中都以简称替代）
- vw/vh转wpx/hpx
- vw转vh
- vh转vw
首先我们需要知道进入哪种功能，定义一个判断进入功能的函数。
- 输入V进入wpx/hpx转vw/vh功能。
- 输入P进入vw/vh转wpx/hpx功能。
- 输入H进入vw转vh功能。
- 输入W进入vh转vw功能。
// 进入计算器类型函数
void how(void)
{printf("\n输入需要进入的计算器：\nwpx/hpx转vw/vh输入：V\nvw/vh转wpx/hpx输入：P\nvw转vh输入：H\nvh转vw输入：W\n");scanf(" %c",&zh);getchar();
}
再定义一个输入页面总宽度 总高度的函数用于计算所需。
// 输入视图的总宽度,总高度
void px(void)
{printf("\n输入总宽度 总高度：");scanf("%f %f",&w,&h);printf("\n");
}
在main主函数中分别给四种功能创建while循环来实现功能。
- while循环条件判断式可以判定 进入哪种功能zh == ’ ’ 和 是否重启计算器ch != ‘R’。
- while语句块内调用三个函数分别是：输入函数 计算输出函数 重启计算器函数。
while(ch!='R' && zh=='V') // 输入V进入wpx/hpx转vw/vh功能
{// 调用输入函数// 调用计算输出函数// 调用重启计算器函数
}
while(ch!='R' && zh=='P') // 输入P进入vw/vh转wpx/hpx功能
{// 调用输入函数// 调用计算输出函数// 调用重启计算器函数
}
while(ch!='R' && zh=='H') // 输入H进入vw转vh功能
{// 调用输入函数// 调用计算输出函数// 调用重启计算器函数
}
while(ch!='R' && zh=='W') // 输入W进入vh转vw功能
{// 调用输入函数// 调用计算输出函数// 调用重启计算器函数
}
定义输入函数，用来存放不同功能所输入的值用于计算。
- wpx/hpx转vw/vh功能：需要输入wpx和hpx。
// 输入元素的宽度和高度
void p_v_scan(void){printf("输入元素的宽度 高度：");scanf("%f %f",&wpx,&hpx);printf("\n");
}
- vw/vh转wpx/hpx功能：需要输入vw和vh。
// 输入元素的vw和vh
void v_p_scan()
{printf("输入元素的vw vh：");scanf("%f %f",&vw,&vh);printf("\n");
}
- vw转vh功能：需要输入vw。
// 输入vw
void vw_vh_scan(void)
{printf("输入元素的vw：");scanf("%f",&vw);printf("\n");
}
- vh转vw功能：需要输入vh。
// 输入vh
void vh_vw_scan(void)
{printf("输入元素的vh：");scanf("%f",&vh);printf("\n");
}
按输入的值转换为本功能对应的单位，定义计算函数。
// vw,vh比例换算函数 wpx/hpx转vw/vh
void p_v(float w,float h,float wpx,float hpx)
{vw=wpx/w*100;vh=hpx/h*100;p_v_print(w,h,vw,vh);
}
// vw,vh转换px换算函数 vw/vh转wpx/hpx
void v_p(float w,float h,float vw,float vh)
{wpx=w*(vw/100);hpx=h*(vh/100);v_p_print(w,h,vw,vh);
}
// vw转vh计算函数 vw转vh
void vw_vh(float w,float h, float vw)
{p_x=w*vw/100;vh=p_x/h*100;wpx=w*(vw/100);vw_vh_print(w,h,vw,vh);
}
// vh转vw计算函数 vh转vw
void vh_vw(float w,float h, float vh)
{p_x=h*vh/100;vw=p_x/w*100;hpx=h*(vh/100);vh_vw_print(w,h,vh,vw);
}
按功能输出不同的内容，定义输出函数。
- 在输出函数中调用了计算函数中重新赋值的全局变量
// 输出vw,vh比例转换结果
void p_v_print(float w,float h, float vw,float vh)
{printf("W:%.1fpx总宽度,H:%.1fpx总高度\n",w,h);printf("wpx：%.1fpx,hpx：%.1fpx\n",wpx,hpx);printf("vw：%.3fvw\nvh：%.3fvh\n\n",vw,vh);
}
// 输出vw,vh转换px结果
void v_p_print(float w, float h, float vw, float vh)
{printf("W:%.1fpx总宽度,H:%.1fpx总高度\n",w,h);printf("vw:%.3f,vh:%.3f\n",vw,vh);printf("wpx：%.1fpx\nhpx：%.1fpx\n\n",wpx,hpx);
}
// 输出vw转vh的结果
void vw_vh_print(float w, float h, float vw, float vh)
{printf("W:%.1fpx总宽度,H:%.1fpx总高度\n",w,h);printf("元素大小:%.1fpx\n",wpx);printf("vw:%.3f=vh:%.3f\n\n",vw,vh);
}
// 输出vw转vh的结果
void vh_vw_print(float w, float h, float vh, float vw)
{printf("W:%.1fpx总宽度,H:%.1fpx总高度\n",w,h);printf("元素大小:%.1fpx\n",hpx);printf("vh:%.3f=vw:%.3f\n\n",vh,vw);
}
实现重选其他功能，定义一个重启计算器的函数。
- 输入0继续本功能，输入字符’R’重新选择功能。
// 重启计算器函数
void clean(void)
{printf("输入R选择其他类型计算器或者重新输入宽高，输入其他任意键开启计算器：");getchar();scanf("%c",&ch);printf("\n\n\n");
}
下面是计算器的完整代码：
- 可直接编译后在命令行运行。
- 不需要输入单位。格式化输入，进入计算器的字母必须为大写，输入元素的宽高px时中间已空格隔开。如:150 40
// 11.9 前端计算器——tzof
#include <stdio.h>float w=0; //总宽度float h=0; //总高度float vw=0; //宽度百分比float vh=0; //高度百分比float wpx=0; //元素宽度float hpx=0; //元素高度float p_x=0; //存放vw vh转换的中间变量char ch='S'; //重启开始char zh='Z'; //开启计算器类型// float pt=0; //pt打印单位
// 进入计算器类型函数
void how(void)
{printf("\n输入需要进入的计算器：\nwpx/hpx转vw/vh输入：V\nvw/vh转wpx/hpx输入：P\nvw转vh输入：H\nvh转vw输入：W\n");scanf(" %c",&zh);getchar();
}
// 输入视图的总宽度,总高度
void px(void)
{printf("\n输入总宽度 总高度：");scanf("%f %f",&w,&h);printf("\n");
}
// 重启计算器函数
void clean(void)
{printf("输入R选择其他类型计算器或者重新输入宽高，输入其他任意键开启计算器：");getchar();scanf("%c",&ch);printf("\n\n\n");
}
// 输入元素的宽度和高度
void p_v_scan(void){printf("输入元素的宽度 高度：");scanf("%f %f",&wpx,&hpx);printf("\n");
}
// 输出vw,vh比例转换结果
void p_v_print(float w,float h, float vw,float vh)
{printf("W:%.1fpx总宽度,H:%.1fpx总高度\n",w,h);printf("wpx：%.1fpx,hpx：%.1fpx\n",wpx,hpx);printf("vw：%.3fvw\nvh：%.3fvh\n\n",vw,vh);
}
// 输入元素的vw和vh
void v_p_scan()
{printf("输入元素的vw vh：");scanf("%f %f",&vw,&vh);printf("\n");
}
// 输出vw,vh转换px结果
void v_p_print(float w, float h, float vw, float vh)
{printf("W:%.1fpx总宽度,H:%.1fpx总高度\n",w,h);printf("vw:%.3f,vh:%.3f\n",vw,vh);printf("wpx：%.1fpx\nhpx：%.1fpx\n\n",wpx,hpx);
}
// 输入vw
void vw_vh_scan(void)
{printf("输入元素的vw：");scanf("%f",&vw);printf("\n");
}
// 输出vw转vh的结果
void vw_vh_print(float w, float h, float vw, float vh)
{printf("W:%.1fpx总宽度,H:%.1fpx总高度\n",w,h);printf("元素大小:%.1fpx\n",wpx);printf("vw:%.3f=vh:%.3f\n\n",vw,vh);
}
// 输入vh
void vh_vw_scan(void)
{printf("输入元素的vh：");scanf("%f",&vh);printf("\n");
}
// 输出vw转vh的结果
void vh_vw_print(float w, float h, float vh, float vw)
{printf("W:%.1fpx总宽度,H:%.1fpx总高度\n",w,h);printf("元素大小:%.1fpx\n",hpx);printf("vh:%.3f=vw:%.3f\n\n",vh,vw);
}
// vw,vh比例换算函数
void p_v(float w,float h,float wpx,float hpx)
{vw=wpx/w*100;vh=hpx/h*100;p_v_print(w,h,vw,vh);
}
// vw,vh转换px换算函数
void v_p(float w,float h,float vw,float vh)
{wpx=w*(vw/100);hpx=h*(vh/100);v_p_print(w,h,vw,vh);
}
// vw转vh计算函数
void vw_vh(float w,float h, float vw)
{p_x=w*vw/100;vh=p_x/h*100;wpx=w*(vw/100);vw_vh_print(w,h,vw,vh);
}
// vh转vw计算函数
void vh_vw(float w,float h, float vh)
{p_x=h*vh/100;vw=p_x/w*100;hpx=h*(vh/100);vh_vw_print(w,h,vh,vw);
}
int main(void)
{printf("\n前端计算器——TZOF\n\n");while(1){how();if(zh!='V' && zh!='P' && zh!='H' && zh!='W'){printf("输入错误请重新输入\n");ch='R';zh='S';}else if(zh=='V' || zh=='P' || zh=='H' || zh=='W'){px();}while(ch!='R'){while(ch!='R' && zh=='V'){p_v_scan();p_v(w,h,wpx,hpx);clean();}while(ch!='R' && zh=='P'){v_p_scan(); v_p(w,h,vw,vh);clean();}while(ch!='R' && zh=='H'){vw_vh_scan();vw_vh(w,h,vw);clean();}while(ch!='R' && zh=='W'){vh_vw_scan();vh_vw(w,h,vh);clean();}}ch='S'; zh='S';}getchar();return 0;
}
计算器源码：https://github.com/tzof/CSDN-webProportionCalculator 点击转跳
这篇关于用c语言编写前端开发中比例计算px转vw/vh的计算器的文章就介绍到这儿，希望我们推荐的文章对编程师们有所帮助！
