Pubnub Realtime System에서 연속 애니메이션을 구현하는 방법 NO 사용자 인터랙션 없음

Question

로딩 애니메이션 바를 실시간으로 보여주는 것처럼 지속적으로 움직이는 앱을 개발 중입니다.

애니메이션 단계 :

1. 는 DIV 박스 이미지
2. 이이 이미지를 변경합니다로드 완료로 로딩 애니메이션 표시 줄을 표시합니다.
3. 다음 단계는 애니메이션로드 막대를 다시 표시하는 것입니다. 완료 될 때까지 기다리십시오.
4. 로드가 완료되면 이미지가 변경되고로드 애니메이션 막대 가 다시 표시됩니다.

위의 단계는 사용자 상호 작용없이 계속 처리됩니다. 로딩 애니메이션 만 모든 변경 사항을 처리합니다.

나는 PubNub의 설명서를 읽었지만 웹 사이트에서 디스플레이를 변경하려면 사용자 상호 작용이 필요합니다. 하지만 제 경우에는 사용자 상호 작용이 없습니다.

어떻게 이런 종류의 앱을 구현할 수 있습니까?

pubnub에서 가능합니까?

Answer 1

PubNub에서 메시지를 보내고 받으려면 사용자 개입이 필요 없습니다. 로드 애니메이션 막대가로드를 완료 할 때 호출되는 일종의 함수가 필요합니다. 로딩 줄이로드가 완료되면, 이와 같은 함수를 호출 :

var UniqueID = PubNub.generateUUID(); //Generate a unique id for user 
pubnub.publish(
    { 
     message: { 
      uuid: UniqueID, 
      finishedLoading: true 
     }, 
     channel: 'testChannel', 
     sendByPost: false, // true to send via posts 
    }); 

당신이 PubNub SDK를 가져올 수 있고, 또한 구독 기능이 기억하십시오. 메시지를 수신하도록 코드를 만들면 다음과 같이 표시됩니다.

window.listener = { 
    status: function(statusEvent) { 

    }, 
    message: function(messageEvent) { 
     if(messageEvent.message.finishedLoading === true) { 
      // Run your picture creation and new loading bar creation code here 
     } 
    } 
pubnub.addListener(listener);