Painting my own Midikeyboard[A basic custom GUI problem]


#1

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
{
public:
	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
		
	}

	~myKey()
	{
		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());
		else
			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());
		else
			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.


#2

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


#3

Done~


#4

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)


#5

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.


#6

fixed

thanks


#7

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?


#8

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