a

MCHP_LOGO.bmp,
speaker_image.bmp,
AudioMute16_2.bmp, and
AudioPlay16_2.bmp from this folder,
apps/training/middleware/dev/usb_speaker/usb_speaker_lab/Icons.

b

ImportSystem Font Arial 14pt from 32 ASCII to 127 ASCII.

Click onEdit Import Ranges and select the required character range. This is an important feature that enables you to import only the characters you need, thereby limiting the amount of memory needed to store the font.

• Start Index indicates the starting ASCII value of the character.
• End Index indicates the last ASCII value of the character.

Alternatively, the range can be provided by Start Character and End Character.

a

In the Graphics Composer Tool Box (top-left pane), under thePrimitives group, left-click and dragRectangle onto theGraphic Composer Screen.

b

In theGraphics Composer Properties tab (top-right pane), observe the properties of thisRectangle.

c

Modify these properties as shown.

d

The screen will now look like this:

a

In the Graphics Composer Tool Box (top-left pane), under thePrimitives group, left-click and dragImage onto theGraphic Composer Screen.

b

Modify the properties of the image through theGraphics Composer Properties as follows:

c

The screen will now look like this:

a

In the Graphics Composer Tool Box, under thePrimitives group, left-click and dragText onto theGraphic Composer Screen.

b

Modify the properties of the text through theGraphics Composer Properties as follows:

c

The screen will now look like this:

a

In the Graphics Composer Tool Box (top-left pane), under thePrimitives group, left-click and dragImage onto theGraphic Composer Screen.

b

Modify the properties of the image through theGraphics Composer Properties as follows:

c

The screen will now look like this:

a

In the Graphics Composer Tool Box, under thePrimitives group, left-click and dragText onto theGraphic Composer Screen.

b

Modify the properties of the text through theGraphics Composer Properties as follows:

c

The screen will now look like this:

a

In the Graphics Composer Tool Box, under thePrimitives group, left-click and dragText onto theGraphic Composer Screen.

b

Modify the properties of the text through theGraphics Composer Properties as follows:

c

The screen will now look like this:

a

In the Graphics Composer Tool Box, under theWidgets group, left-click and dragSlider onto theGraphic Composer Screen.

b

Modify the properties of the slider in theGraphics Composer Properties window as follows:

c

Notice that the slider eventsIncremented andDecremented are checked. Click on the **browse button ** (ellipsis found beside the check boxes) to add a custom action to the slider events.

d

When the "browse button" is clicked, an Event Editor window will open. Click on theAdd button to add an action to the sliderIncremented event.

e

In theAction window, SelectType of action asCustom. Rename the action toCustomAction. Copy the following code into theCustom Action Definition window.

The custom action increments the audio volume based on the position of the volume slider.

f

Similarly, add the following code to theDecremented event of the slider.

The custom action decrements the audio volume based on the position of the volume slider.

g

The screen will now look like this:

a

In the Graphics Composer Tool Box, under theWidgets group, left-click and dragButton onto theGraphic Composer Screen.

b

Modify the properties of the button in theGraphics Composer Properties pane as shown in the following image:

c

Notice that the button eventsPressed andReleased are checked. Also, notice that the button has enabled theToggle option. This option allows the button to be used as an ON/OFF button. Also, the default state is specified as "Pressed". The Pressed state corresponds to Mute Off. And release state corresponds to Mute On. This links the images with the appropriate Pressed and Released states.
Click on thebrowse button to add a custom action to the button events.

d

In the Action window, SelectType of action asCustom. Rename the action toCustomAction. Copy the following code into theCustom Action Definition window for thePressed event.

Copy the following code for the Released event.

e

The screen will now look like this:

f

Verify that the Graphics Library is configured as follows by expanding theHarmony Framework Configuration > Graphics Library > Harmony Graphics Library > Use Graphics Library? selection tree.

The Display Settings have values specific to the display (4.3 inch, WQVGA display by NewHaven). These include horizontal and vertical timing parameters and others. For details, refer to the display datasheet.

a

Modify "Number of I2C Driver Clients" and "Number of I2C Driver Instances" to2.

b

You configured "I2C Driver Instance 0" in a previous step. Just verify "Use Bit Bang I2C Implementation" is still unchecked.

c

ExpandI2C Driver Instance 1, and make sure "Use Bit Bang I2C Implementation?" is unchecked. Since you are using the PIC32 I2C peripherals, you do not want to use the bit-banged driver implementation.

d

Retain "I2C_ID_1" as theI2C Module ID.

e

Retain default value "DRV_I2C_MODE_MASTER" asOperation Mode. The PIC32 I2C module 1 will be the master and the Touch MTCH6301 interface will be the slave.

f

Change value for "Master Interrupt Priority" and "Master Interrupt Sub-priority" asINT_PRIORITY_LEVEL4 andINT_SUBPRIORITY_LEVEL0 respectively. Lower priority for touch events is OK as this will not be occurring very frequently.

g

Change value for "Error Interrupt Priority" and "Error Interrupt Sub-priority" asINT_PRIORITY_LEVEL4 andINT_SUBPRIORITY_LEVEL0 respectively.

h

The "Baud Rate generator clock" is configured for 100 MHz. This is derived from the Peripheral bus 2 clock frequency generated from the 198 MHz system clock.

i

Retain the default value of50 KHz for "I2C CLOCK FREQUENCY".

j

Retain theSlew Rate Control as unchecked. This function enables the I2C module to use high-frequency signaling, allowing it to use the 400 kHz and 1 MHz signaling rates.

k

Retain the default value ofSYS_MODULE_POWER_RUN_FULL for "Power State". You will want to run the I2C module in normal power mode.

l

Verify the I/O Pins used by the I2C module using the Graphical Pin Manager. Click on MHC's "Pin Diagram" tab, and in MHC's lower pane, click on the “Pin Table” tab.

The I2C1 has dedicated pins for SCL1 and SDA1 signals. These pins are hardcoded and configured by the I2C driver.