Expand my Community achievements bar.

July 31st AEM Gems Webinar: Elevate your AEM development to master the integration of private GitHub repositories within AEM Cloud Manager.

Change look of WebCamera Component

Avatar

Level 2

Hello,

Am trying to change the look and feel of Webcamera component. I would really like it so that it looks more like Skype i.e. the user's video appears in a small box and the other videos appear in a big box.

Also, how do I change the colours and other things of the component?

Thank you very much for your time and patience.

3 Replies

Avatar

Employee

Hi Anantgarg,

The WebCamera Component consists of individual WebcamPublisher & WebcamSubscriber components. Both the WebcamPublisher and WebcamSubscriber extend the mx.core.UIComponent . So you should be able to manipulate the look and feel and size of the WebCameraComponent, and implement a skype like functionality.

Please refer to the WebCamera example in the sampleApps that comes along with the SDK. The example demonstrates how the WebcamPublisher & WebcamSubscriber can be used to build a custom WebCamera app.

Thanks

Arun

Avatar

Level 2

Can you please elaborate on how to do this or point me to the correct resources. Sorry, am very new to this. Also, when I start Webcamsubscriber and publisher, as soon as I publish my video, it appears in the subscriber. I do not want the user's video to appear in the subscriber section. is there any way around that?

Thank you for your time and patience.

Avatar

Former Community Member

Hi Anant,

You need to refer to examples like WebCamera and ZoomLayout. By default, your subscriber shows all the camera streams including yours. In case you don't want that, you need to use the publisherIDs property in WebCamSubscriber and only give the set of userIDs of users whose camera stream you want to see( in this case , everyone except you).

For the skype type layout you initially mentioned, you can have it with two subscribers. One having only one stream in its publisherID property i.e. the user who is sharing and rest all others in another Subscriber. Each Subscriber can be given width and height and placed wherever you want to. As I mentioned, look at those example codes to see how multiple webcamsubscribers can be used to achieve different layouts.

Hope this helps.

Thanks

Hironmay Basu