How to place my logo on my map without white fields? - image

I have a problem with the my picturebox.
I want to place it on my map which i got in my program.
That works when i put my img in a Picturebox and then BringToFront();
i wanted to add a picture with the problem, but i just started at StackOverflow and doesnt have enough reputation yet... :(
Anyway my img got displayed but with the white fields around it. The img I use doenst have these white stuff around it.
How can i make my Picturebox transparent so that the white fields get removed.
LogoBox.Location = new Point(size.Width - 340, size.Height - 100);
LogoBox.Image = Properties.Resources.Troepoet;
LogoBox.Size = new System.Drawing.Size(250, 40);
LogoBox.SizeMode = PictureBoxSizeMode.StretchImage;
LogoBox.BackColor = Color.Transparent;
I tried to do it with only drawing a bitmap aswell but then i cant see any possibility to place it on the map. The map is a 'dominant' control.
Any help/suggestions?
Thx.

You don't need to put a picturebox on the map to draw your logo.
The easy way is to override the Map OnPainOverlays() and draw whatever you want (Logo, Text, any shape) on the map or another way if you don't want to inherit the GmapControl and work with the GMapControl by drag & drop it over a form to handle the Paint() Event:
Private Sub GMapControl1_Paint(sender As Object, e As PaintEventArgs) Handles GMapControl1.Paint
Dim logo As Image = image.FromFile("C:\transparentLogo.png")
e.Graphics.DrawImage(logo, GMapControl1.Width - logo.Width - 5, 5, logo.Width, logo.Height)
End Sub
Make sure you make image transparent and save it as PNG format.

Related

PySDL2: Renderer or Window Surface for handling colors and text?

My question concerns the sdl2.ext.Renderer mainly, and has to do with a problem I've encountered when trying to render sprites on a sdl2.ext.Window surface.
So right now, for coloring my background on an SDL2 Window, I make the following call:
White = sdl2.ext.Color(255,255,255)
class Background(sdl2.ext.SoftwareSpriteRenderSystem):
def __init__(self,window):
super(Background,self).__init__(window)
sdl2.ext.fill(self.surface,White)
This colors the surface of the Window with a white background. However, I also want to display text on the screen. This is done by creating a TextureSprite using the from_text method of the sdl2.ext.SpriteFactory class as follows:
Renderer = sdl2.ext.Renderer(W) # Creating Renderer
ManagerFont = sdl2.ext.FontManager(font_path = "OpenSans.ttf", size = 14) # Creating Font Manager
Factory = sdl2.ext.SpriteFactory(renderer=Renderer) # Creating Sprite Factory
Text = Factory.from_text("Unisung Softworks",fontmanager=ManagerFont) # Creating TextureSprite from Text
Renderer.copy(Text, dstrect= (0,0,Text.size[0],Text.size[1])) # Resizing the Texture to fit the text dimensions when rendered
The problem occurs when the event loop is run.
running = True
while running:
events = sdl2.ext.get_events()
for event in events:
if event.type == sdl2.SDL_QUIT:
running = False
break
if event.type == sdl2.SDL_MOUSEBUTTONDOWN:
pass
Renderer.copy(Text, dstrect= (0,0,Text.size[0],Text.size[1]))
Renderer.present() # Problem 1
W.refresh() # Problem 2
return 0
Full Example Paste
When both Renderer.present() and W.refresh() are called, I get a flickering effect from the screen. This seems to be because the Renderer overwrites the White colored Window surface, which then gets colored over again by the Window.refresh() call. This then repeats, resulting in a flickering mess.
I would like to know what I can do to solve this problem? Should I even be using both Window.refresh() and the Renderer at the same time? Is there a way to let one render the other? (Renderer renders background for example). If anyone can help me out, that would be great.
The problem is that you are using Window.refresh() along with a SDL_Renderer and a SoftwareSpriteSystem with SDL_Texture objects.
As outlined in the PySDL2 docs, this is likely to break (since software surface buffers get mixed with hardware-based textures) and you should avoid it. If you want to color the window background, you should use Renderer.clear(White) instead of your Background class and call it before copying the text via Renderer.copy():
Renderer.clear(White)
Renderer.copy(Text, dstrect= (0,0,Text.size[0],Text.size[1]))
Renderer.present()
Do not forget to change the color for your FontManager. By default it uses a white text color, so you should change it to e.g. your Red color:
ManagerFont = sdl2.ext.FontManager(font_path = "OpenSans.ttf", size = 14, color=Red)

BlueJ - GUI JTextField, how to make the corners of it round like an oval?

How do I make the corners of a TextField round?
I'm using Javax.swing.*;
Here's my code for BlueJ:
inputLine = new JTextField();
inputLine.setBounds(480, 350, 150, 30);
contentPane.add(inputLine);
inputLine.setForeground(Color.black);
inputLine.setBackground(Color.white);
inputLine.setBorder(BorderFactory.createLineBorder(Color.black));
inputLine.setFont(new Font("Tahoma", Font.BOLD, 13));
inputLine.setHorizontalAlignment(JTextField.CENTER);
inputLine.setEditable(true);
contentPane.add(inputLine);
inputLine.addActionListener(this);
inputLine.setText("ID Number");
what you can do, is first create a Jframe window.
If you want only a text Field, make the dimensions of the j Frame a bit bigger than the preferred text Field size.
Then, set the layout of the jFrame to absolute.
Create a Jlabel that covers the whole screen Jframe.
Create the text Field only after this step.
Then create the text Field at the preferred location in the j Frame.
Design a graphic / picture for the background and set the icon of the background jLabel to the graphic you have designed.
The graphic you have designed must have a rounded rectangular picture in it and the text Field must be exactly positioned on top of that.
Once that is done set the opacity of the Text Field to 0.0. This should work very well...
JFrame frame = new JFrame("FrameDemo");
jframe.setPreferredSize(new Dimension(x, y));
[please add the other methods to create a jframe window...these are only the basic commands]
pane.setLayout(null);//makes it an absolute layout so that it does not reshape itself
frame.setVisible(true);
after doing this, design your graphics.
then:
import it into the current working directory, where this program has been written.
then:
create a jLabel inside the jFrame.
JLabel label1 = new JLabel("JLabel Set Icon Example.");
set its icon to the graphic you have designed.
label1.setIcon(new ImageIcon("full path of the image _ with the proper file extension"));
then
textField = new JTextField(desired value);//please add the desired value into the brackets
//set its location and all the other thing that are required
set the location of the textField exactly over the the rounded rectangle in the graphic.
then:
textField.isOpaque("false");
jTextField1.setBorder(null);//this should work
and there you go...the user will think that the textField is a rounded rectangle but actually it is like a rectangle which has a transparent background...
let me know if there are any problems.
thanks.

HTML5 canvas - Rescale images on load?

Ok, so I'm doing an html5 canvas game, and I need to draw resized images all the time (it's all pixel-art). Unfortunately, doing the resizing on drawImage makes current browsers quite sluggish, so I'm trying to do the resizing on load, and then just draw the pre-resized image.
I've tried to draw the resized images to a hidden context and then do a ctx.getImageData, but then I'm stuck with a byte array and there's no way to convert to an image. I can do a putImageData to push it to the final context, but that's slow and I apparently lose the alpha channel.
Another option could be to pre-scale things in the server, but I'd like to avoid that if at all possible.
Any ideas?
There is a method on the canvas object (not the context) called toDataURL(string mimeType), this will convert the canvas contents to a base64-encoded binary string of an image. You can use this as the src attribute of any image element.
ctx.drawImage(originalImage, 0, 0, originalImage.width, originalImage.height, 0, 0, 200, 200);
var scaledImage = new Image();
scaledImage.onload = ...;
scaledImage.src = canvas.toDataURL("image/png");
Now you can draw your scaled image normaly.

Wp7 clear canvas value

I am using canvas to add image programatically.
for example:
Image image1=new image1();
Image image2=new image1();
var left = new BitmapImage();
left.UriSource = new Uri("images/box.png", UriKind.Relative);
image1.Source = left;
image2.Source = left;
ContentPanelCanvas.Children.Add(image1);
ContentPanelCanvas.Children.Add(image2);
First time enter the loop Add Image to canvas. second time i want to clear canvas.
and again add different images same canvas.
Is this possible wp7.
tell some idea to do this.
thanks
Yes, it is possible:
ContentPanelCanvas.Children.Clear();
This will empty the canvas.
Why not simply change the Source property of the images you already added?

Trouble with OpenLayers Styles

So, tired of always seeing the bright orange default regular polygons, I'm trying to learn to style OpenLayers.
I've had some success with:
var layer_style = OpenLayers.Util.extend({},OpenLayers.Feature.Vector.style['default']);
layer_style.fillColor = "#000000";
layer_style.strokeColor = "#000000";
polygonLayer = new OpenLayers.Layer.Vector("PolygonLayer");
polygonLayer.style = layer_style;
But sine I am drawing my polygons with DrawFeature, my style only takes effect once I've finished drawing, and seeing it snap from bright orange to grey is sort of disconcerting. So, I learned about temporary styles, and tried:
var layer_style = new OpenLayers.Style({"default": {fillColor: "#000000"}, "temporary": {fillColor: "#000000"}})
polygonLayer = new OpenLayers.Layer.Vector("PolygonLayer");
polygonLayer.style = layer_style;
This got me a still orange square--until I stopped drawing, when it snapped into completely opaque black. I figured maybe I had to explicitly set the fillOpacity...no dice. Even when I changed both fill colors to be pink and blue, respectively, I still saw only orange and opaque black.
I've tried messing with StyleMaps, since I read that if you only add one style to a style map, it uses the default one for everything, including the temporary style.
var layer_style = OpenLayers.Util.extend({}, OpenLayers.Feature.Vector.style['default']);
var style_map = new OpenLayers.StyleMap(layer_style);
polygonLayer = new OpenLayers.Layer.Vector("PolygonLayer");
polygonLayer.style = style_map;
That got me the black opaque square, too. (Even though that layer style works when not given to a map). Passing the map to the layer itself like so:
polygonLayer = new OpenLayers.Layer.Vector("PolygonLayer", style_map);
Didn't get me anything at all. Orange all the way, even after drawn.
polygonLayer = new OpenLayers.Layer.Vector("PolygonLayer", {styleMap: style_map});
Is a lot more succesful: Orange while drawing, translucent black with black outline when drawn. Just like when I didn't use a map. Problem is, still no temporary...
So, I tried initializing my map this way:
var style_map = new OpenLayers.StyleMap({"default": layer_style, "temporary": layer_style});
No opaque square, but no dice for the temporary, either... Still orange snapping to black transparent. Even if I make a new Style (layer_style2), and set temporary to that, still no luck. And no luck with setting "select" style, either.
What am I doing wrong? Temporary IS for styling things that are currently being sketched, correct? Is there some other way specific to the drawFeature Controller?
Edit: setting extendDefault to be true doesn't seem to help, either...
var style_map = new OpenLayers.StyleMap({"default": layer_style, "temporary": layer_style}, {"extendDefault": "true"});
I've found two solutions for this problem. In both solution, you have to change some parameters of DrawFeature to get the functionality you wish.
1.Change handler style of the DrawFeature. Function drawFeature in OpenLayers.Handler.Polygon uses parameter style of the handler for the feature. So you have to change this style.
When creating Feature use:
var drawPolygon = new OpenLayers.Control.DrawFeature(polygonLayer, OpenLayers.Handler.Polygon, {handlerOptions:{style:myStyle}});
Later, you can change it by:
drawPolygon.handler.style = myStyle;
2.Change create callback of the DrawFeature. Change style of the newly created temporary feature in create callback.
var drawPolygon = new OpenLayers.Control.DrawFeature(polygonLayer, OpenLayers.Handler.Polygon, {
callbacks:{create: function(vertex, feature) {
feature.style = myStyle;
this.layer.events.triggerEvent("sketchstarted", {vertex:vertex,feature:feature})
}}});
Similarly, you can change the callback later.
If you want all vectors to be of a constant style, but not the boring orange then try this:
vecLayer = new OpenLayers.Layer.Vector(
"Route Layer", //layer name
{styleMap: new OpenLayers.StyleMap({
pointRadius: "6",
fillColor: "#666666"
}),
renderers:renderer}
);
You have loads of properties you can mess about with, have a look at these pages:
dev.openlayers (check the Constants section)
docs.openlayers (more useful info)

Resources