Painting my own Midikeyboard[A basic custom GUI problem]


I want to use my own 2 frames Image to paint my midikeyboardcomponent, but have some problem.

My code is like this:

#include "includes.h"

#pragma once

class myKey : public MidiKeyboardComponent
	myKey(File const& image, File const& image1, MidiKeyboardState &state, const Orientation orientation)
		: MidiKeyboardComponent(state, orientation)
		filmStrip = ImageFileFormat::loadFrom(image);   //white
		filmStrip1 = ImageFileFormat::loadFrom(image1); //black
		setKeyWidth(filmStrip->getWidth() / 2);				//white width

		if (filmStrip)
			delete filmStrip;
		if (filmStrip1)
			delete filmStrip1;

	void  drawWhiteNote (int midiNoteNumber, Graphics &g, 
						 int x, int y, int w, int h, 
						 bool isDown, bool isOver, 
						 const Colour &lineColour, const Colour &textColour) 
		if (isDown)
			g.drawImage(filmStrip, x, y, w, h, 
			filmStrip->getWidth() / 2, 0, filmStrip->getWidth() / 2, filmStrip->getHeight());
			g.drawImage(filmStrip, x, y, w, h, 0, 0, filmStrip->getWidth() / 2, filmStrip->getHeight());


	void drawBlackNote (int /*midiNoteNumber*/,
                                           Graphics& g, int x, int y, int w, int h,
                                           bool isDown, bool isOver,
                                           const Colour& noteFillColour)
		if (isDown)
			g.drawImage(filmStrip1, x, y, w, h, 
			filmStrip1->getWidth() / 2, 0, filmStrip1->getWidth() / 2, filmStrip1->getHeight());
			g.drawImage(filmStrip1, x, y, w, h, 0, 0, filmStrip1->getWidth() / 2, filmStrip1->getHeight());


	Image* filmStrip;
	Image* filmStrip1;


It seems it can’t call the constructor of MidiKeyboardComponent class. What’s wrong with it?

Besides, to paint my keyboard, is this code capable? What else should be added?

Thanks in advance.


(you might want to try the “[code]” tag to make your listing a bit more readable - hard to tell what’s going on there…)




The code has something wrong, I correct them and it works now seemingly fine, but the black keys are transparent, how to make it opaque? (I’ve override drawblacknote and drawwhitenote, how could it happen)


You probably just need to call g.setOpacity (1.0f) in your black note method. A previous graphics operation could have set a non-solid colour.





BTW, the sliders are filmstrip jpg, they have their own background color(which is black in the picture above). I think every one wants the area outside the slider itself to be transparent…

What’s the generic way for professional programmers to achieve that?


simply make those areas you want transparent, transparent. You’d do that in your image editor, and you would absolutely not use jpg; the best choice is .png