Tizen SDK CSS ID未呈現

Question

我對可穿戴設備使用Tizen 2.3.1 SDK，並遇到無論我對style.css文件做什麼的問題，添加任何新的id都會拒絕工作。

* { 
    margin: 0; 
    padding: 0 
} 

html, body { 
    width: 100%; 
    height: 100%; 
    background-color: black; 
} 

#str_day { 
    position: absolute; 
    display: -webkit-flex; 
    width: 50%; 
    height: 50%; 
    background: yellow; 
    color: yellow; 
    z-index: 4; 
    opacity: 1; 
} 

h1 { 
    font-size: 1.4em; 
    margin: 10px 0 20px 10px; 
    color: #6587ac; 
} 

#box { 
    display: -webkit-flex; 
    -webkit-align-items: center; 
    width: 100%; 
    height: 100% 
} 

.canvas { 
    background: #000; 
    width: 320px; 
    height: 320px; 
    margin: auto; 
} 

這是我的代碼。我正在嘗試添加str_day id，但是當我通過模擬器運行程序包時，它不會顯示出來。其餘的CSS（主要是畫布元素）工作正常，但str_day只是不顯示。我試圖指定z-index和opacity以防發生一些奇怪的問題，但這似乎不成問題。

這是我在github上的完整代碼。

https://github.com/JoyfulOwl/RadialWatch/commit/86d096710c7187b6b3679e02416548e18a3e986e

Answer 1

可能是因爲不當的CSS佈局str_day的渲染/繪您的錶盤，因爲其中的不可見的視區之外。

我認爲更好的方法是使用畫布fillText命令在畫布上打印日期。

請嘗試下面的示例。

var canvas = document.getElementById("myCanvas"); 
var context=canvas.getContext("2d"); 
context.font="30px Comic Sans MS"; 
context.fillStyle = "red"; 
context.textAlign = "center"; 
context.fillText(str_Day, mCenterX, mCenterY); // mCenterX & mCenterY are the position where text has to be shown.