☺ 这个笑脸是如何打出来的？

Posted 2023-04-16

经常看到老外发来的邮件里面有这个小小的圆圆的笑脸，很想知道打出这个笑脸的快捷键，请高人指点，非常感谢！

搜狗拼音输入法输入xiaolian，第5个就是白色笑脸。还可以用ctrl+shift+z就出来个搜狗输入法的符号在里面找有好多的。

人生活在社会关系中喜怒哀乐各种“感情”，是人“感”于外物所发之“情”，它是人对周边所发生的事情的一种反映， 同时，它也是向周围的人表达自己心情的形式， 但最主要的还是人内心对事物的反映。

这种反映是建立与个人的心理之上的， 是用来表现自己的感受的， 这样世界才会丰富多彩。正是由于人是感性的动物，在人类社会中，在这个多彩多姿却也多灾多难的社会中，人就是因为有了坚定的信念和乐观的精神而拼搏着，奋斗着，微笑着。

是为了证明自己活着，也许岁月会像风刮走流沙一般，慢慢的什么也不会留下，但最少他有了过程，也有了永恒。千千万万的人都会在这个大自然中留下自己曾经的讯息。让自己沉缅，让后人触摸。 

笑脸 微信表情和苹果自带表情很多代码是一样的。

参考技术A 在英文状态下Shift+；号在点）是笑脸（是哭脸 参考技术B 把字体换成wingdings，然后shift+J , 也可+其他字母，会有不同表情。 参考技术C 用搜狗拼音输入法输入xiaolian,第5个就是白色笑脸。求采纳☺☺本回答被提问者和网友采纳 参考技术D

用多个球从圆形边界反弹？

【中文标题】用多个球从圆形边界反弹？

【英文标题】：Bouncing off a circular Boundary with multiple balls?

【发布时间】：2013-11-22 11:01:56

【问题描述】：

我正在制作这样的游戏：

黄色笑脸要逃离红色笑脸，当黄色笑脸撞到边界时游戏结束，当红色笑脸撞到边界时，它们应该以它们来的相同角度反弹，如下所示：

每10秒一个新的红色笑脸出现在大圆圈中，当红色笑脸碰到黄色时，游戏结束，红色笑脸的速度和起始角度应该是随机的。我用箭头键控制黄色笑脸。我遇到的最大问题是：创建多个红色笑脸，并将红色笑脸从边界反射到它们来的角度。我不知道如何给一个红色笑脸一个起始角度，并随着它出现的角度反弹它。我会很高兴任何提示！ html 文件中的 Mycanvas 大小为 700x700。

我的js源码：

var canvas = document.getElementById("mycanvas");

var ctx = canvas.getContext("2d");

// Object containing some global Smiley properties.
var SmileyApp = 
   radius: 15,
   xspeed: 0,
   yspeed: 0,
   xpos:200,  // x-position of smiley
   ypos: 200  // y-position of smiley
;

var SmileyRed = 
   radius: 15,
   xspeed: 0,
   yspeed: 0,
   xpos:350,  // x-position of smiley
   ypos: 65  // y-position of smiley
;
function drawBigCircle() 
 var centerX = canvas.width / 2;
      var centerY = canvas.height / 2;
      var radiusBig = 300;

      ctx.beginPath();
      ctx.arc(centerX, centerY, radiusBig, 0, 2 * Math.PI, false);
//      context.fillStyle = 'green';
//      context.fill();
      ctx.lineWidth = 5;
 //     context.strokeStyle = '#003300'; // green
      ctx.stroke();


function lineDistance( positionx, positiony )

  var xs = 0;
  var ys = 0;

  xs = positionx - 350;
  xs = xs * xs;

  ys = positiony - 350;
  ys = ys * ys;

  return Math.sqrt( xs + ys );

function drawSmiley(x,y,r) 
   // outer border
   ctx.lineWidth = 3;
   ctx.beginPath();
   ctx.arc(x,y,r, 0, 2*Math.PI);
  //red ctx.fillStyle="rgba(255,0,0, 0.5)";
   ctx.fillStyle="rgba(255,255,0, 0.5)";
   ctx.fill();
   ctx.stroke();

   // mouth
   ctx.beginPath();
   ctx.moveTo(x+0.7*r, y);
   ctx.arc(x,y,0.7*r, 0, Math.PI, false);

   // eyes
   var reye = r/10;
   var f = 0.4;
   ctx.moveTo(x+f*r, y-f*r);
   ctx.arc(x+f*r-reye, y-f*r, reye, 0, 2*Math.PI);
   ctx.moveTo(x-f*r, y-f*r);
   ctx.arc(x-f*r+reye, y-f*r, reye, -Math.PI, Math.PI);

   // nose
   ctx.moveTo(x,y);
   ctx.lineTo(x, y-r/2);
   ctx.lineWidth = 1;
   ctx.stroke();


function drawSmileyRed(x,y,r) 
   // outer border
   ctx.lineWidth = 3;
   ctx.beginPath();
   ctx.arc(x,y,r, 0, 2*Math.PI);
  //red 
  ctx.fillStyle="rgba(255,0,0, 0.5)";
  //yellow ctx.fillStyle="rgba(255,255,0, 0.5)";
   ctx.fill();
   ctx.stroke();

   // mouth
   ctx.beginPath();
   ctx.moveTo(x+0.4*r, y+10);
   ctx.arc(x,y+10,0.4*r, 0, Math.PI, true);

   // eyes
   var reye = r/10;
   var f = 0.4;
   ctx.moveTo(x+f*r, y-f*r);
   ctx.arc(x+f*r-reye, y-f*r, reye, 0, 2*Math.PI);
   ctx.moveTo(x-f*r, y-f*r);
   ctx.arc(x-f*r+reye, y-f*r, reye, -Math.PI, Math.PI);

   // nose
   ctx.moveTo(x,y);
   ctx.lineTo(x, y-r/2);
   ctx.lineWidth = 1;
   ctx.stroke();



// --- Animation of smiley moving with constant speed and bounce back at edges of canvas ---
var tprev = 0;   // this is used to calculate the time step between two successive calls of run
function run(t) 
   requestAnimationFrame(run);
   if (t === undefined) 
      t=0;
   
   var h = t - tprev;   // time step 
   tprev = t;

   SmileyApp.xpos += SmileyApp.xspeed * h/1000;  // update position according to constant speed
   SmileyApp.ypos += SmileyApp.yspeed * h/1000;  // update position according to constant speed
   // change speed direction if smiley hits canvas edges
   if (lineDistance(SmileyApp.xpos, SmileyApp.ypos) + SmileyApp.radius > 300) 
     alert("Game Over");
   

   // redraw smiley at new position
   ctx.clearRect(0,0,canvas.height, canvas.width);
   drawBigCircle();
   drawSmiley(SmileyApp.xpos, SmileyApp.ypos, SmileyApp.radius);
   drawSmileyRed(SmileyRed.xpos, SmileyRed.ypos, SmileyRed.radius);


run();     

// --- Control smiley motion with left/right arrow keys                        
function arrowkeyCB(event) 
   event.preventDefault();

   if (event.keyCode === 37)  // left arrow
      SmileyApp.xspeed = -100; 
      SmileyApp.yspeed = 0;
    else if (event.keyCode === 39)  // right arrow
      SmileyApp.xspeed = 100; 
      SmileyApp.yspeed = 0;
    else if (event.keyCode === 38)  // up arrow
      SmileyApp.yspeed = -100;
      SmileyApp.xspeed = 0;   
    else if (event.keyCode === 40)  // right arrow
      SmileyApp.yspeed = 100; 
      SmileyApp.xspeed = 0;
   

document.addEventListener('keydown', arrowkeyCB, true);

JSFiddle : http://jsfiddle.net/X7gz7/

【问题讨论】：

你能设置一个工作的fiddle吗？

@Rob 当然：jsfiddle.net/X7gz7

【参考方案1】：

您需要找出与碰撞点相切/垂直的线。然后从180度减去切线和半径线相交形成的角度，找到一个新的角度。

稍后我会发布更多解释的图片。