I am using the dynamic data display WPF chart. I have a requirement to display a label next to every point on the curves plotted on the chart.
The exact functionality is as follows:
Every curve has a an object that holds its data and a description that inculdes color, marker shape etc. It also tell me whether the labels must be visible for that particular curve.
There is also an option using a checkbox to hide/show the labels for all points on all the curves on the plot.
There is a third option where a user can left click on the marker and see a label next to it.
Now, I previously implemented it by adding labels along with the ElementMarkerPointGraph for each point and setting the visibility of the labels. I know there is a massive performance hit with this approach.
I am now looking to create a solution where I can render text directly to the canvas at a location that I provide. I also need help with the removing the text from the canvas.
Is there a way of adding text natively to the canvas? What is the most efficient way to do so?
EDIT: I need to move the text around as the plotter zooms. I already know when the plotter zooms, I need to be able to move the text to the appropriate location.
I'm not sure whether this will give you the zooming purpose but the code below can be used to add text inside a canvas..I got it from a site while googling.
private void Text(double x, double y, string text, Color color)
{
TextBlock textBlock = new TextBlock();
textBlock.Text = text;
textBlock.Foreground = new SolidColorBrush(color);
Canvas.SetLeft(textBlock, x);
Canvas.SetTop(textBlock, y);
canvasObj.Children.Add(textBlock);
}
OK. My exact implementation can't be put up here. But I can provide some idea of how to do it.
So create a simple user control that derives from Canvas.
class CustomCanvas : Canvas
{
protected override void OnRender(DrawingContext dc)
{
FormattedText someFormattedText = new FormattedText(someText, System.Globalization.CultureInfo.CurrentCulture, FlowDirection.LeftToRight,
someTypeFace, someFontSize, someColor);
dc.DrawText(someFormattedText, new Point(15, 15));
}
}
You can seal the class, if you do not want it subclassed/overriden further.
That's about it. You can check out the other methods available with the drawing context to do some other stuff. :)
I figured it out myself. I'll be overriding the OnRender method to handle this. I can draw text using the drawing context.
Related
I am writing an application in .NET that has a plugin interface. That plugin interface provides several ways to draw information (controls) onto the surface of the application window. While there are several reasons why I am doing this, the main reason is to provide custom colorization to text, either through the use of a graphic or directly manipulating the color of the text based on the background color. I do this through the use of a "text mask" which is a black and white bitmap that works as an "alpha" map to let the Paint method know where to apply the texture/color changes.
The plugin developer has the option of using regular text (such as with a label), mask text (which is drawn to the mask rather than as a regular control), OR letting the user decide. To go along with this, I have provided a modified label class that can either be drawn "normally' (when the text mask is not set for the control), or to the text mask when the User OR Developer decides (depending on what the plugin developer wishes to offer to the user). Here is the class's code so that you understand how this is being done:
public class MaskingLabel : Label
{
private static readonly SolidBrush maskBrush = new SolidBrush(Color.White);
public Bitmap Mask { get; set; }
public MaskingLabel() : base() { }
protected override void OnPaint(PaintEventArgs e)
{
if (Mask == null)
base.OnPaint(e);
else
{
Graphics g = Graphics.FromImage(Mask);
g.DrawString(Text, Font, maskBrush, Location);
}
}
}
The problem I am running into is that this approach requires that I handle controls in a very specific order so that the form is drawn correctly. I need to find the most efficient approach to get the tasks listed below done in the order given. I have thought of three possibilities discussed further down. For reference, this is the order in which tasks must be done:
All "MaskingLabel" controls that have the bitmap object set to the mask must be drawn first so that the mask is created before the next step.
The mask is applied to the background picture.
The resulting Bitmap is drawn in a way similar to the way a background would be drawn (except that it is modified first).
The rest of the controls are drawn as normal.
Is there a way for me to insure this happens without separating the controls manually? My first guess is no. As such, I have a few guesses below about how I should go about this. I was hoping someone with more in depth knowledge of GDI+ could offer some insight.
One idea that has occurred to me is to draw the masked controls during the OnPaintBackground method. However, I don't want to waste time by painting the controls twice. This means I would need to filter out which controls are drawn during the main Paint method which effectively leads us to option 2 (FAIK):
I can manually filter out the controls which draw to the mask so that they don't get added to the control. My question here though is would they get drawn at all? Can I manually force them to invoke the OnPaint method?
If doing that wouldn't work, then perhaps I can create a separate derived panel control to serve as a "backdrop" child control that acts as the background picture which can be forced to be drawn first?
EDIT (With Part of the answer):
I realized after posting this that I already have part of the solution built into my project. Still, I think it is a legitimate question to ask, so if anyone can add insight beyond what I have done in my description below, it is welcome.
Specifically, my project has only two controls that are added to the "root" form: a bar that goes to the top (docked at the top when it is shown), and a transparent panel that occupies the rest of the space (with a dock style set to fill). So my solution would be to add the mask controls to the main form and add all the rest to the panel. This only leaves one remaining issue to be resolved: How do I make sure that the panel and the bar are drawn last? (As part of step 4 in the first list?)
How to make a circle with text inside ?? then move it from one location to another, and then access it later (to delete it).
I want to make something like this
Your question is really very broad and you got a few nice links you should study to learn all about GDI+ drawing.
But if taken literally there is a slightly exotic alternative which puts the burdon of most chores onto the Chart control from DataVisualization.Charting.
You can create EllipseAnnotations and add them to a Chart control.
Disable the Axes and clear the Legends and then use code like this to add a moveable circle wit thext inside:
EllipseAnnotation ea = new EllipseAnnotation();
ea.X = 11; // put at..
ea.Y = 11; // 11% of the chart's area
ea.AllowMoving = true;
ea.BackColor = Color.BlanchedAlmond;
ea.Text = (chart1.Annotations.Count + 1) + "";
chart1.Annotations.Add(ea);
Note that there are quite a few annotation types available. which allow you to add Rectangles, Images, Polygons, Lines and pure Text.
And another pro is that saving or loading the graphics takes only one line each, as you can serialize a Chart out of the box!
:-)
GraphX for .NET is an advanced open-source graph layout and visualization library that supports different layout algorithms and provides many means for visual customizations It is capable of rendering large amount of vertices
https://github.com/panthernet/GraphX
To draw shapes follow here.Also you need a complete tut,you can follow here
Some insight is here:
To draw a simple shape at design time Drag the OvalShape or
RectangleShape control from the Visual Basic PowerPacks tab (to
install, see Visual Basic Power Packs Controls)in the Toolbox to a
form or container control.
Drag the sizing and move handles to size and position the shape. You
can also size and position the shape by changing the Size and Position
properties in the Properties window To create a rectangle with rounded
corners, select the CornerRadius property in the Properties window
and set it to a value that is greater than 0. In the Properties
window, optionally set additional properties to change the appearance
of the shape. To draw a simple shape at run time On the Project
menu, click Add Reference. In the Add Reference dialog box, select
Microsoft.VisualBasic.PowerPacks.VS, and then click OK. In the Code
Editor, add an Imports or using statement at the top of the module:
using Microsoft.VisualBasic.PowerPacks; Add the following code in an Event procedure:
ShapeContainer canvas = new ShapeContainer();
// To draw an oval, substitute
// OvalShape for RectangleShape.
RectangleShape theShape = new RectangleShape();
// Set the form as the parent of the ShapeContainer.
canvas.Parent = this;
// Set the ShapeContainer as the parent of the Shape.
theShape.Parent = canvas;
// Set the size of the shape.
theShape.Size = new System.Drawing.Size(200, 300);
// Set the location of the shape.
theShape.Location = new System.Drawing.Point(100, 100);
// To draw a rounded rectangle, add the following code:
theShape.CornerRadius = 12;
Customizing Shapes When you use the default settings, the OvalShape and RectangleShape controls are
displayed with a solid black border that is one pixel wide and a
transparent background. You can change the width, style, and color of
the border by setting properties. Additional properties enable you to
change the background of a shape to a solid color, a pattern, a
gradient fill, or an image. Before you change the background of a
shape, you should know how several of the properties interact. The
BackColor property setting has no effect unless the BackStyle property
is set to Opaque. If the FillStyle property is set to Solid, the
FillColor overrides the BackColor. If the FillStyle property is set to
a pattern value such as Horizontal or Vertical, the pattern will be
displayed in the FillColor. The background will be displayed in the
BackColor, provided that the BackStyle property is set to Opaque. In
order to display a gradient fill, the FillStyle property must be set
to Solid and the FillGradientStyle property must be set to a value
other than None. Setting the BackgroundImage property to an image
overrides all other background settings.
This SO link I found is also nice here
There have been several earlier questions related to adding number values to the ticks on a WPF Slider (e.g. here and here). All proposed solutions I have found so far are to do with inheriting from the TickBar class and then using DrawText(FormattedText text, Point point) to draw the value. Something like:
protected override void OnRender(DrawingContext dc)
{
foreach(double tick in Ticks)
{
formattedText = new FormattedText(Convert.ToString(tick),
CultureInfo.GetCultureInfo("en-us"),
FlowDirection.LeftToRight,
new Typeface("Verdana"), // I don't know why all examples use the Verdana font :P
10, Brushes.Black);
dc.DrawText(formattedText, ComputeTheRightPosition(tick));
}
}
While this is a valid solution, I am finding that it is not generic enough for me, due to the FormattedText. In my application, the Style can change at runtime, so I would prefer a way of putting all the numbers in a TextBlock or something, which can dynamically update its style and font and all.
Is it possible to add text boxes in this way in anSlider or TickBar subclass?
Out of the box solution -
Put a canvas above the slider. When slider value changes, get a ratio of value / (max-min)
Use the same ratio to place the textblock in the canvas using SetLeft or Render Transform.
So, I have a shape I'm programatically generating, when it has a small amount of text, it looks like this:
If I add a huge amount of text however, it flows out of the shape, like so:
What I want to do is to hide the overflow and to force the text to start from the top of the shape (currently the text starts from a position higher than the top of the shape)
I haven't found much information about this so far, here is the code I'm using for the text inside the shape:
var shape = slide.Shapes.AddShape(MsoAutoShapeType.msoShapeRectangle, left, top, width, height);
var textRange2 = shape.TextFrame.TextRange.InsertAfter(description);
textRange2.Font.Size = 10;
shape.TextFrame.TextRange.Paragraphs().ParagraphFormat.Alignment = PpParagraphAlignment.ppAlignLeft;
shape.TextFrame.TextRange.Paragraphs().Font.Name = "Consolas";
shape.TextFrame.TextRange.Paragraphs().Font.Color.RGB = foregroundColor;
One last thing, I know I could just limit the string, but this would impose problems for the user. I want him to be able to resize the shape manually if there is too much text, so that's a no-go. Basically, I just want the equivalent of the css overflow:hidden rule.
One option for some users may be to use the following:
shape.TextFrame.AutoSize = PpAutoSize.ppAutoSizeShapeToFitText;
This will resize the shape to fit the text, there should also be an option to resize TEXT to fit the shape instead (resizing of fonts), I can't seem to find the function however.
Thanks guys
So, apparently
shape.TextFrame.AutoSize
accepts an enumerable PpAutoSize which has PpAutoSize.ppAutoSizeShapeToFitText; that can be used
whereas
shape.TextFrame2.AutoSize
accepts an enumerable MsoAutoSize which has MsoAutoSize.msoAutoSizeTextToFitShape;
So basically, if you change the textframe you're using to TextFrame2 instead of TextFrame, you can have the text resize to fit the shape automagically.
shape.TextFrame2.AutoSize = MsoAutoSize.msoAutoSizeTextToFitShape;
In Powerpoint directly- there is an option to do this. Based on the placement in the menu, I would guess it is in the shape.TextFrame.AutoSize Property - maybe the "mixed" Option?
The PowerPoint object model is a huge mess - so it might be some other strane Property...
I am trying to make a tool in c# which allows the user to put a grid on the screen on a picturebox. At the moment i don't know how to do this, so when a button is clicked, the picturebox comes up with a grid. It needs to be a grid which is spaced out enough that users can find out locations of objects on the picture in the picturebox. Help with what code i can use to do this would be very helpful as i was going to use ControlPaint.DrawGrid but not sure of the values i need to put in it to get my desired effect?
Thanks
Form the Documentation od controlpaint.Drawgrid,
I suppose you need to decide on the cell size in x- amd y-direction and pass this as a size parameter to Drawgrid:
public static void DrawGrid(
Graphics graphics,
Rectangle area,
Size pixelsBetweenDots,
Color backColor
)
for example, a 100*200 pixels square grid would be generated by
setting graphcis to the context you want to draw upon,
Setting area to the top left right and bottom parameters of your image
setting size.x to 100 and size.y to 200
setting color to any color you like.
Update
Something like this should do.
Rectangle myRect = new System.drawings.Rectangle();
myRect.Location := new System.Drawing.Point(0,0);
myRect.Height = 50;
myRect.Width = 50;
Drawgrid(FromImage(yourImage), mygrid , yourImage.Size, System.Drawing.Color.Black);
Disclaimer: i don't develope in c#, so above code is not tested for anything. I just picked stuff from the documentation (msdn).