← 수업 제작 도구
홈 › Components › Graph and Graphing Calc › 화면 15

화면 15. Graph.resetAnimationOnChange [sink]

원본: Computation Layer 문서(Graph) · Try It (원본 화면)

화면 번호15 / 29
문서 항목 설명 (원문)Specify a string value. If that value changes, the animation timer resets.

1. 화면 캡처 (빨간 번호 = 아래 표의 번호)

화면 15 캡처

2. CL이 입력된 곳

코드 안의 회색 줄은 원문 영어 주석이고, 파란 줄은 그 영어 주석의 번역이며, 연분홍 줄은 코드가 하는 일의 설명이다.

번호이름종류CL 코드 원문, 번역, 설명
1master CL
(화면 전체)
SCREEN
subtitle: "Press play on the graph to start the timer. Then press the four colored buttons in order to complete the code.\nRewinding the time clears and resets the puzzle."
▶ 화면 제목 아래에 표시할 부제목(subtitle)은 "Press play on the graph to start the timer. Then press the four colored buttons in order to complete the code.\nRewinding the time clears and resets the puzzle."(그래프의 재생 버튼을 눌러 타이머를 시작하시오. 그런 다음 네 가지 색 버튼을 순서대로 눌러 코드를 완성하시오. 시간을 되감으면 퍼즐이 지워지고 처음으로 돌아간다.)로 한다.
글자 안의 \n은 줄바꿈이라서 두 줄로 표시된다.
2graphLeft그래프
# Create the animation cover.
# In this example, set the total length to 60 sec.
▷ 애니메이션 덮개를 만든다. 이 예제에서는 전체 길이를 60초로 정한다.
animationDuration: 60
▶ 애니메이션 재생 시간(animationDuration)은 60초로 한다.
이 값을 정하면 그래프 위에 재생바(playhead)가 생긴다.
number(`t_0`): this.animationTime ▶ 그래프의 변수 t_0는 this.animationTime으로 한다.
변수 이름을 백틱으로 감싸 적었으며, 백틱으로 감싼 글자는 latex 값이다. this.animationTime은 이 그래프의 재생 위치를 알려 준다. 재생바가 움직이면 t_0의 값도 같이 바뀐다.
# Reset the animation every time "btn" is pressed. ▷ "btn"이 눌릴 때마다 애니메이션을 처음으로 되돌린다. resetAnimationOnChange: "${btn.pressCount}" ▶ 애니메이션을 처음으로 되돌리는 조건(resetAnimationOnChange)은 "${btn.pressCount}", 즉 버튼 btn을 누른 횟수(btn.pressCount)를 글자로 만든 것으로 한다.
resetAnimationOnChange는 글자 값을 받고, 그 값이 바뀌면 애니메이션 타이머가 처음으로 돌아간다. ${ }는 글자 안에 값을 끼워 넣는 표기이다.
3GraphRight그래프
# Uses the animation time from graphLeft to start the timer.
▷ graphLeft의 애니메이션 시간을 사용해 타이머를 시작한다.
number(`T`): graphLeft.animationTime
▶ 그래프의 변수 T는 graphLeft의 재생 위치(graphLeft.animationTime)로 한다.
변수 이름을 백틱으로 감싸 적었으며, 백틱으로 감싼 글자는 latex 값이다. graphLeft.animationTime은 graphLeft의 재생 위치를 알려 준다.
# Sets the variable p_{lay} in this graph to 1 when graphLeft is # currently animating and 0 if not. ▷ graphLeft가 재생 중이면 이 그래프의 변수 p_{lay}를 1로, 아니면 0으로 정한다. number(`p_{lay}`): when graphLeft.isAnimating 1 otherwise 0 ▶ 그래프의 변수 p_{lay}는 graphLeft.isAnimating이 참(재생 중)이면 1, 아니면 0으로 한다.
graphLeft.isAnimating은 graphLeft가 재생 중인지를 참 또는 거짓으로 알려 준다.
4btn행동 버튼
# Do not show the "Start Over" button until
# the animation has started.
▷ 애니메이션이 시작되기 전에는 "Start Over" 버튼을 표시하지 않는다.
hidden: graphLeft.animationTime = 0
▶ 버튼의 숨김 조건(hidden)은 graphLeft.animationTime = 0, 즉 graphLeft의 재생 위치가 0이면 참으로 한다.
hidden은 참이면 이 구성요소를 학생에게 보여 주지 않는다. 재생 시작 전에는 참이라서 "Start Over" 버튼이 숨겨지고, 재생이 시작되면 거짓이 되어 버튼이 나타난다.