如何使单元格每隔X秒钟更改颜色? [英] How can I make a cell change colour every x seconds?
本文介绍了如何使单元格每隔X秒钟更改颜色?的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
所以我正在研究Google表格上的文档，我希望它看起来不错，这段代码确实无关紧要，但是知道如何做到这一点将非常高兴，因为无论如何我学到的每一点都可以在将来对您有所帮助.
So I am working on a document on google sheets and I want it to look nice, this code really is unimportant but it would great to know how to do it, as every bit I learn anyways, can help in the future.
更多技术性的事情可能是1个单元格更改为某种颜色，然后另一个单元格确定该单元格已经更改了颜色，因此它也更改了颜色，并且一直持续到在最后一个单元格上循环(某种创建彩虹效果).
Something a bit more technical could be 1 cell changes to a certain colour, then the other cell identifies that that cell has changed colour so it also changes colour, and it keeps going until it loops on the last cell (to kind of create a rainbow effect).
但是请记住，google文档表中没有很多条件格式，并且您不能使用宏，而必须使用Google Sheet脚本.
Please remember though, a lot of conditional formatting is unavailable in google docs sheets and you can't use macros, you have to use Google Sheet Script.
推荐答案
每x秒更改颜色
Code.gs:
function onOpen(){
SpreadsheetApp.getUi().createMenu('MyTools')
.addItem('Show Sidebar', 'showTimerSideBar')
.addToUi();
}
function showTimerSideBar()
{
var ui=HtmlService.createHtmlOutputFromFile('datatimer').setTitle('Color Timer');
SpreadsheetApp.getUi().showSidebar(ui);
}
function changeData(){
var ss=SpreadsheetApp.getActive();
var sh=ss.getSheetByName('ColorChange');
var rg=sh.getRange('A1:A10');
var colorA=rg.getBackgrounds();
var n=new Date();
var tmr=Utilities.formatDate(n, Session.getScriptTimeZone(), "HH:mm:ss")
var rObj={color:colorA[Math.floor(Math.random()*colorA.length)][0],timer:tmr};
ss.toast(Utilities.formatString('timer: %s color: %s', rObj.timer,rObj.color));
return rObj;
}
function saveData(dObj) {
var ss=SpreadsheetApp.getActive();
var sh=ss.getSheetByName('Data');
var lr=sh.getLastRow();
sh.getRange(lr+1,1).setValue(dObj.timer);
sh.getRange(lr+1,2).setBackground(dObj.color);
}
function setA1(color) {
var ss=SpreadsheetApp.getActive();
var sh=ss.getSheetByName('ColorChange');
var rg=sh.getRange('A1');
rg.setBackground(color);
}
datatimer.html:
datatimer.html:
<!DOCTYPE html>
<html>
<head>
<base target="_top">
<link rel="stylesheet" href="https://ssl.gstatic.com/docs/script/css/add-ons1.css">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no"/>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
<script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
<style>
#my_block{border:2px solid black;background-color:rgba(0,150,255,0.2);padding:10px 10px 10px 10px;}
#conv_block{border: 1px solid black;padding:10px 10px 10px 10px;}
.bttn_block{padding:2px 5px 0px 0px;}
.sndr_block {border:1px solid rgba(0,150,0,0.5);background-color:rgba(150,150,0,0.2);margin-bottom:2px;}
</style>
</head>
<body>
<form>
<div id="my_block" class="block form-group">
<div class="sndr_block">
<div id="myClock" style="font-size:20px;font-weight:bold;"></div>
<br />Timer Duration(seconds):
<br /><input id="txt1" type="text" size="4" class="action"/>
<select id="sel1" onChange="loadTxt('sel1','txt1');">
</select>
<div id="cntdiv"></div>
<br /><strong>Timer Controls</strong>
<div class="bttn_block"><input type="button" value="Start" name="startShow" id="startShow" onClick="startmytimer();changeData();" class="red" /></div>
<div class="bttn_block"><input type="button" value="Stop" name="stopTimer" id="stopTimer" class="red" /></div>
<div class="bttn_block"><input type="button" value="Single Ping" name="changedata" id="chgData" class="red" onClick="changeData();" /></div>
<div class="bttn_block"><input type="button" value="Red" name="setA1Red" id="setRed" class="red" onClick="setA1('#ff0000');" /></div>
<div class="bttn_block"><input type="button" value="Green" name="setA1Green" id="setGreen" class="green" onClick="setA1('#00ff00');" /></div>
</div>
<div id="btn-bar">
<br /><input type="button" value="Exit" onClick="google.script.host.close();" class="green" />
</div>
</div>
</form>
<script>
var idx=1;
var myInterval='';
var cnt=0;
$(function() {
var select = document.getElementById('sel1');
select.options.length = 0;
for(var i=1;i<61;i++)
{
select.options[i-1] = new Option(i,i * 1000);
}
select.selectedIndex=4;
$('#startTimer').click(startmytimer);
$('#stopTimer').click(stopTimer);
$('#txt1').val(String(select.options[select.selectedIndex].value));
startTime();
});
function startTime(){
var today = new Date();
var h = today.getHours();
var m = today.getMinutes();
var s = today.getSeconds();
m = checkTime(m);
s = checkTime(s);
document.getElementById('myClock').innerHTML =
h + ":" + m + ":" + s;
var t = setTimeout(startTime, 500);
}
function checkTime(i){
if (i < 10) {i = "0" + i}; // add zero in front of numbers < 10
return i;
}
function startmytimer(){
document.getElementById('cntdiv').innerHTML='<strong>Timer Started:</strong> ' + document.getElementById('myClock').innerHTML;
myInterval=setInterval(changeData, Number($('#txt1').val()));
}
function stopTimer(){
document.getElementById('cntdiv').innerHTML='Timer Stopped';
clearInterval(myInterval);
}
function loadTxt(from,to){
document.getElementById(to).value = document.getElementById(from).value;
}
function exportData() {
google.script.run.saveData(cA);
}
function changeData(){
$('#txt1').css('background','#ffffcc');
google.script.run
.withSuccessHandler(function(rObj){
updateDisplay(rObj.timer);
saveData({timer:rObj.timer,color:rObj.color});
$('#txt1').css('background','#ffffff');
})
.changeData();
}
function updateDisplay(t){
$('#txt1').css('background','#ffffff');
document.getElementById('cntdiv').innerHTML='<strong>Timer Running:</strong> Count= ' + ++cnt + ' <strong>Time:</strong> ' + t;
}
function setA1(color) {
console.log(color);
google.script.run.setA1(color);
}
function saveData(dObj) {
google.script.run.saveData(dObj);
}
console.log('My Code');
</script>
</body>
</html>
当前颜色:(颜色更改表)
Current Colors: (ColorChange Sheet)
数据表:
计时器补充工具栏:
我修改了一个现有脚本来为您提供此示例.因此，这里可能还有其他不相关的脚本.可以根据自己的特定需求进行修改.
I modified an existing script to provide you with this example. So there may be other unrelated scripts in here. Feel free to modify it to fit your specific needs.
这篇关于如何使单元格每隔X秒钟更改颜色?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
