greeple
Gold Member | Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
SGirl
в файле background.js рисуется стрелка, закрашивается полностью
тут меняется цвет стрелки (я тут поменял на твой)
Код: var lightColors = {
progressColor: '#0d0',
arrow: '#565656',
danger: 'red',
complete: '#8FED24',
paused: 'grey',
background: 'white',
progressBar: '#ddd',
timeLeft: '#fff',
}
var darkColors = {
progressColor: '#0d0',
arrow: '#565656',
danger: 'red',
complete: '#8FED24',
paused: 'grey',
background: 'white',
progressBar: '#ddd',
timeLeft: '#444',
} |
тут обводка (изначально закрашивается обводка и фон в один цвет)
Код: function drawArrow(ctx,color) {
ctx.beginPath();
ctx.lineWidth = 3;
ctx.lineJoin = 'round';
ctx.strokeStyle = '#ffffff';
ctx.fillStyle = color;
ctx.lineWidth = 1;
ctx.lineJoin = 'round';
ctx.strokeStyle = '#9fa2a4';
ctx.fillStyle = color;
var center = ctx.canvas.width/2;
var minw2 = center*0.20;
var maxw2 = center*0.60;
var height2 = maxw2+1;
ctx.moveTo(center-minw2, center-height2);
ctx.lineTo(center+minw2, center-height2);
ctx.lineTo(center+minw2, center);
ctx.lineTo(center+maxw2, center);
ctx.lineTo(center, center+height2);
ctx.lineTo(center-maxw2, center);
ctx.lineTo(center-minw2, center);
ctx.lineTo(center-minw2, center-height2);
ctx.lineTo(center+minw2, center-height2);
ctx.stroke();
ctx.fill();
} |
как тут правильно ободку нарисовать я уже не спец, по моему тут
ctx.lineWidth это ширина обводки ctx.strokeStyle это цвет, и ctx.fillStyle заливка самой фигуры
у тебя помимо белой обводки ещё есть вторая #9fa2a4 серая добавил две (в верхний код), но как по мне лучше если прям нужна обводка, то одну оставить в 3 или 2 пикселя, вот ниже с одной обводкой белой в 3 пикселя
Код: function drawArrow(ctx,color) {
ctx.beginPath();
ctx.lineWidth = 3;
ctx.lineJoin = 'round';
ctx.strokeStyle = '#ffffff';
ctx.fillStyle = color;
var center = ctx.canvas.width/2;
var minw2 = center*0.20;
var maxw2 = center*0.60;
var height2 = maxw2+1;
ctx.moveTo(center-minw2, center-height2);
ctx.lineTo(center+minw2, center-height2);
ctx.lineTo(center+minw2, center);
ctx.lineTo(center+maxw2, center);
ctx.lineTo(center, center+height2);
ctx.lineTo(center-maxw2, center);
ctx.lineTo(center-minw2, center);
ctx.lineTo(center-minw2, center-height2);
ctx.lineTo(center+minw2, center-height2);
ctx.stroke();
ctx.fill();
} |
|
Всего записей: 6113 | Зарегистр. 11-02-2020 | Отправлено: 22:20 03-10-2023 | Исправлено: greeple, 22:22 03-10-2023 |
|
