DesktopX: Media Player (Basic)

From WinCustomize Wiki

Jump to: navigation, search


Behind the Theme, Part 3 - Media Player
Nrg mediaSS.jpg
Media player basics
Original Author:sViz
Date Created:October 4, 2010
Application:DesktopX
Programs Used:DesktopX


This tutorial is part 3 in the series DesktopX: Behind the Theme. Previously, we created the recycle bin and the system information objects. Today, we’ll explore plugins further, and how to put together a media player.

First, decide what controls you want on your media player. I had about 13 controls on mine, but here we'll learn how to do the play button, volume, and clip name; this will show how to do a simple button, a slider control, and text.


Contents

Play Button

Create a new object. Add the DXPlayer plugin (Remember: plugins are found under Properties > General > Additional Abilities)

Under Additional Abilities, select the plugin you just added. Then, click configure, and the options window will appear.

Dxplayer configwindow.png

In the DXPlayer options window, you’ll see three checkboxes up top marked Default, Ctrl, and Alt. Unless you’re doing a really complex media player, just select Default.

In the drop down below that, select Player Button.

In the list below that, select Play.

Before we leave this window, we want to set our player of choice. Click on the button marked User Preferences. In the preferences window that appears, select your preferred player. I use Internal Windows Media Player.

Button States

Next, we go to the States tab to set the appearance of the button. You’ll note there are several Media states there. Again, these are only necessary if you’re doing a really ‘authentic’ player where the play button might be multiple-action--play/pause/resume--in which case you'd need to set the appearance for all relevant Media states.

For this tutorial, the play button is just a play button. All you have to do is set the Mouse Away image; click on it and browse for your play button image.

In the NrG theme, I also had the buttons ‘light up’ when you mouse over them. To do that, click the Add button and choose the Mouse Over state. Next, click the Copy From button and copy the Mouse Away state.

With the Mouse Over state still selected, go to the Color tab. Set Brightness to 25.

You would follow these same steps for any other single action button.

Cloning

To save time in creating the other single-action buttons, such as stop, pause, next, etc, you can simply clone the play button.

To do this, right-click on the play button and choose Clone Object. Right-click on the clone and choose Configure DXPlayer to change the button action. Adjust the plugin settings and images and you're done.


Volume

Create a new object and add the DXPlayer plugin. Click configure to open the options window.

Check the Default box, and in the drop down under that, select Fader/Slider.

In the list below the drop down, you’ll see two Volume options: Volume (fad) and Volume (sli). Choose Volume(sli).

With sliders, the images are not set in the States tab. To set images, click on the Images button below the list.

In the options window that appears, you’ll see that you need two images—the background image or slider bar (Background), and the slider button image (Image.)

Browse for your images and you’re done.


Clip Name

Create a new object and add the DXPlayer plugin. Click configure to open the options window.

Check the Default box, and in the drop down under that, select Text Display.

In the list below, choose Clip Name. To set the look of the text go to the States tab > Appearance.

Creating a Mask

You’ll note that in the NrG media player, long titles are clipped and scroll across the designated space. To do this, we need to create a mask and then add a scrolling plugin.

To create the mask, create a new object—the mask object—and give it a plain, square image.

Place the clip name text object inside the mask object. Right click on the clip name and Set Parent to the mask object. (You may need to open Properties > Summary and set parent manually as well as set child to ‘yes’.)

You’ll see that the text is not visible when dragging the clip name outside the mask parameters. Resize the mask object to fit in the designated space.

Scrolling Plugin

To add the scrolling plugin, right-click on the clip name and go to Properties > General > Additional Abilities and add the Object Slider plugin.

Select the plugin you just added and click Configure to open the Object Slider options window.

The Move Each dropdown controls speed (the higher the slower), the Move By dropdown controls how smoothly it scrolls (the higher the more jumpy), and the Mode dropdown controls whether to scroll the text back and forth or looped in one direction. I chose Move Left Only.


Conclusion

When you've finished creating your media player, be sure to group them. By the time you add all the control buttons, sliders, and text you want on your media player, you should be familiar with:

  • Adding and configuring DXPlayer controls, plugins
  • Setting the images for sliders
  • Creating a mask
  • Cloning


Further Reading