lgladsden/jf-roku
1
0
Fork 0
Code Issues 1 Pull Requests Packages Projects Releases Wiki Activity

Add audio buffering bar to NowPlaying scene

Browse Source
This commit is contained in:
1hitsong 2022-05-30 15:28:31 -04:00
parent b47cd5696c
commit 7d74727ca3
2 changed files with 33 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

32
components/music/NowPlaying.brs
View File

@ -15,6 +15,9 @@ sub setupAnimationTasks()
m.displayButtonsAnimation = m.top.FindNode("displayButtonsAnimation")
m.playPositionAnimation = m.top.FindNode("playPositionAnimation")
m.playPositionAnimationWidth = m.top.FindNode("playPositionAnimationWidth")
m.bufferPositionAnimation = m.top.FindNode("bufferPositionAnimation")
m.bufferPositionAnimationWidth = m.top.FindNode("bufferPositionAnimationWidth")
end sub
' Creates tasks to gather data needed to renger NowPlaying Scene and play song
@ -37,6 +40,7 @@ sub setupAudioNode()
m.top.audio = createObject("RoSGNode", "Audio")
m.top.audio.observeField("state", "audioStateChanged")
m.top.audio.observeField("position", "audioPositionChanged")
m.top.audio.observeField("bufferingStatus", "bufferPositionChanged")
end sub
' Setup playback buttons, default to Play button selected
@ -62,17 +66,37 @@ sub setupInfoNodes()
m.albumCover = m.top.findNode("albumCover")
m.backDrop = m.top.findNode("backdrop")
m.playPosition = m.top.findNode("playPosition")
m.bufferPosition = m.top.findNode("bufferPosition")
m.seekBar = m.top.findNode("seekBar")
end sub
sub bufferPositionChanged()
if not isValid(m.top.audio.bufferingStatus)
bufferPositionBarWidth = m.seekBar.width
else
bufferPositionBarWidth = m.seekBar.width * m.top.audio.bufferingStatus.percentage
end if
' Ensure position bar is never wider than the seek bar
if bufferPositionBarWidth > m.seekBar.width
bufferPositionBarWidth = m.seekBar.width
end if
' Use animation to make the display smooth
m.bufferPositionAnimationWidth.keyValue = [m.bufferPosition.width, bufferPositionBarWidth]
m.bufferPositionAnimation.control = "start"
end sub
sub audioPositionChanged()
if not isValid(m.top.audio.position)
m.playPosition.width = 0
playPositionBarWidth = 0
else
songPercentComplete = m.top.audio.position / m.top.audio.duration
playPositionBarWidth = m.seekBar.width * songPercentComplete
end if
songPercentComplete = m.top.audio.position / m.top.audio.duration
playPositionBarWidth = m.seekBar.width * songPercentComplete
' Ensure position bar is never wider than the seek bar
if playPositionBarWidth > m.seekBar.width
playPositionBarWidth = m.seekBar.width

6
components/music/NowPlaying.xml
View File

@ -9,7 +9,8 @@
<Label id="song" width="900" height="25" horizAlign="center" />
<Label id="numberofsongs" width="500" height="25" horizAlign="center" font="font:SmallestSystemFont" color="#999999" />
</LayoutGroup>
<Rectangle id="seekBar" color="0xFFFFFF44" width="500" height="10">
<Rectangle id="seekBar" color="0x00000099" width="500" height="10">
<Rectangle id="bufferPosition" color="0xFFFFFF44" height="10"></Rectangle>
<Rectangle id="playPosition" color="#00a4dcFF" height="10"></Rectangle>
</Rectangle>
<LayoutGroup id="buttons" layoutDirection="horiz" horizAlignment="center" itemSpacings="[45]">
@ -17,6 +18,9 @@
<Poster id="play" width="64" height="64" uri="pkg:/images/icons/play-default.png" />
<Poster id="next" width="64" height="64" uri="pkg:/images/icons/next-default.png" opacity="0" />
</LayoutGroup>
<Animation id="bufferPositionAnimation" duration="1" repeat="false" easeFunction="linear">
<FloatFieldInterpolator id="bufferPositionAnimationWidth" key="[0.0, 1.0]" fieldToInterp="bufferPosition.width" />
</Animation>
<Animation id="playPositionAnimation" duration="1" repeat="false" easeFunction="linear">
<FloatFieldInterpolator id="playPositionAnimationWidth" key="[0.0, 1.0]" fieldToInterp="playPosition.width" />
</Animation>