Background color for TabControl? - tabcontrol

I'm working on a browser that's running on Geckofx, and well I can't find a way to change the color of the TabControl
I don't want to change the tab page, I want to change the container.
Here's what I mean:
This is what i'm trying to do:
And this is where i'm at:
I'm already using this for the tabs
private void tabControl_DrawItem(object sender, System.Windows.Forms.DrawItemEventArgs e)
{
{
TabPage CurrentTab = tabControl.TabPages[e.Index];
Rectangle ItemRect = tabControl.GetTabRect(e.Index);
SolidBrush FillBrush = new SolidBrush(Color.Red);
SolidBrush FBG = new SolidBrush(Color.Black);
SolidBrush TextBrush = new SolidBrush(Color.Green);
StringFormat sf = new StringFormat();
sf.Alignment = StringAlignment.Center;
sf.LineAlignment = StringAlignment.Center;
if (System.Convert.ToBoolean(e.State & DrawItemState.Selected))
{
FillBrush.Color = Color.Black;
TextBrush.Color = Color.Green;
ItemRect.Inflate(0, 0);
}
if (tabControl.Alignment == TabAlignment.Left || tabControl.Alignment == TabAlignment.Right)
{
float RotateAngle = 90;
if (tabControl.Alignment == TabAlignment.Left)
RotateAngle = 270;
PointF cp = new PointF(ItemRect.Left + (ItemRect.Width / 3), ItemRect.Top + (ItemRect.Height / 5));
e.Graphics.TranslateTransform(cp.X, cp.Y);
e.Graphics.RotateTransform(RotateAngle);
ItemRect = new Rectangle(-(ItemRect.Height / 3), -(ItemRect.Width / 3), ItemRect.Height, ItemRect.Width);
}
e.Graphics.FillRectangle(FillBrush, ItemRect);
e.Graphics.DrawString(CurrentTab.Text, e.Font, TextBrush, (RectangleF)ItemRect, sf);
e.Graphics.ResetTransform();
FillBrush.Dispose();
TextBrush.Dispose();
}
}
I just have no idea how to change the color of the TabControl
I've looked over online everywhere and the examples either made 0 sense whatsoever or did not work.
I know it's possible from the example i've seen
Can anyone help?

TabControl have the propertie BackColor, from Control. Maybe if nothing work, try to set the DefaultBackColor to the color you need for your TabControl?
Look at this : http://msdn.microsoft.com/en-us/library/system.windows.forms.control.defaultbackcolor.aspx

Related

Uno platform: load embedded resource file

How do I load an embedded resource for the Android head ? My code, below works for UWP:
Assembly assembly = GetType ().GetTypeInfo ().Assembly;
string[] names = assembly.GetManifestResourceNames ();
Console.WriteLine ("Resource Names");
foreach (var name in names)
Console.WriteLine (" " + name);
using (var stream = assembly.GetManifestResourceStream (Source))
{
bmpSrc = SKBitmap.Decode (stream);
}
And, the XAML is
<controls:ExpandableImage
...
Source="UnoTest.Assets.icons.folder_tab.png"
/>
The file resides in UnoTest.Shared/Assets/ and is marked as "embedded resource".
The debug output shows that one of the "names" is
"UnoTest.Droid.Assets.icons.folder_tab.png"
indicating that my URI should be referring to the Android head.
EDIT
Ultimately, in this experiment, I am intending to paint the left part of the bitmap in the left of the target area, the right in the right, and fill the middle with an expansion of a vertical stripe from the bitmap's mid section. Then, draw some text over it.
private void OnPaintSurface(object sender, SKPaintSurfaceEventArgs e)
{
...
// identify left, right halves and a 10px wide swath of the middle of the source bitmap
SKRect rectSrcLeft = new SKRect(0, 0, bmpSrc.Width / 2, bmpSrc.Height);
SKRect rectSrcRight = new SKRect(bmpSrc.Width / 2, 0, bmpSrc.Width, bmpSrc.Height);
SKRect rectSrcMid = new SKRect(bmpSrc.Width / 2 - 5, 0, bmpSrc.Width / 2 + 5, bmpSrc.Height);
// create a new bitmap containing a 10 pixel wide swatch from middle of bmpSrc
SKBitmap bmpSrcMid = new SKBitmap(10, bmpSrc.Height);
using (SKCanvas tempCanvas = new SKCanvas(bmpSrcMid))
{
SKRect rectDest = new SKRect(0, 0, rectSrcMid.Width, rectSrcRight.Height);
tempCanvas.DrawBitmap(bmpSrc, rectSrcMid, rectDest);
}
var canvas = e.Surface.Canvas;
using (SKPaint paint = new SKPaint())
{
canvas.Save();
float hDest = canvas.DeviceClipBounds.Height;
float scale = hDest / (float)bmpSrc.Height;
canvas.Scale(scale);
paint.IsAntialias = true;
// determine dest rect for middle section
float rightDest = (float)textBounds.Width / scale; // rightmost point of whole target area
SKRect rectDestMid = new SKRect(rectSrcLeft.Width, 0, rightDest - rectSrcRight.Width, rectSrcRight.Height);
// left part of tab
canvas.DrawBitmap(bmpSrc, rectSrcLeft, rectSrcLeft, paint);
// right part of tab
{
SKRect rectDest = new SKRect(rectDestMid.Right, 0, rightDest, rectSrcRight.Height);
canvas.DrawBitmap(bmpSrc, rectSrcRight, rectDest, paint);
}
// mid part of tab
paint.Shader = SKShader.CreateBitmap(bmpSrcMid,
SKShaderTileMode.Repeat,
SKShaderTileMode.Repeat);
canvas.DrawRect(rectDestMid, paint);
canvas.Restore(); // back to orig scale
}
using (SKPaint paint = new SKPaint { Color = SKColors.Black })
{
float leftText = 20; // matches padding in ListPage.xaml
float bottomText = canvas.DeviceClipBounds.Height / 2 + textCoreHeight / 2;
canvas.DrawText(Label, new SKPoint(leftText, bottomText), paint);
}
}
The XAML for the control is:
<UserControl
x:Class="UnoTest.Shared.Controls.ExpandableImage"
...
<skia:SKXamlCanvas x:Name="EICanvas" PaintSurface="OnPaintSurface" />
</UserControl>
Do I need to write some code to modify the "generic" URI for the Android case ?
Embedded Resources defined in shared projects are sharing the default namespace of the project referencing that shared project, making the file name different in all projects by default in Uno templates.
You have multiple options:
Change the default namespace to be the same in all projects.
Skip the first two dots and use this as the base
Use a different project (a .NET Standard 2.0 project will do) and place your resources there
Here's what I ended up doing. It is not 100% robust but pretty close. And it's really simple.
if (Source == null)
return;
string sourceWithNameSpace = null;
Assembly assembly = GetType ().GetTypeInfo ().Assembly;
string[] names = assembly.GetManifestResourceNames ();
foreach (var name in names)
{
if (name.EndsWith (Source))
{
sourceWithNameSpace = name;
break;
}
}
if (sourceWithNameSpace == null)
return;
using (var stream = assembly.GetManifestResourceStream (sourceWithNameSpace))
{
bmpSrc = SKBitmap.Decode (stream);
}
And, in the XML file, leave off the project head from the Source path, e.g.:
Source="Assets.icons.folder_tab.png"

Present Sheet in a center of parent window

I use function
NSViewController.PresentViewControllerAsSheet(NSViewController)
and everything works great, but I would like to have a chance change the position of this sheet (for ex. in the center of parent).
How to do that ?
Ok, I have found solution:
C# code, Xamarin.Mac
controller.PresentViewControllerAsModalWindow(_settingsController);
if (_settingsController.View.Window != null)
{
var x = (_window.Frame.Left) + (_window.Frame.Width / 2) - 400;
var y = (_window.Frame.Top) + (_window.Frame.Height / 2) - 300;
_settingsController.View.Window.SetFrame(new CoreGraphics.CGRect(x, y, 800, 600), true);
_settingsController.View.Window.TitleVisibility = NSWindowTitleVisibility.Hidden;
_settingsController.View.Window.TitlebarAppearsTransparent = true;
_settingsController.View.Window.StyleMask = NSWindowStyle.FullSizeContentView | NSWindowStyle.Borderless;
_settingsController.View.Window.IsMovable = false;
}

Why are audio clicks/pops occurring when the position of a PannerNode is updated rapidly?

I've been experimenting with the PannerNode for quite some time and in cases where I'm updating position of the panner repeatedly using either requestAnimationFrame() or setInterval(), I've noticed clicking/popping of audio.
Why is this happening and how can it be resolved?
I'd hoped that it would be fixed with the introduction of position as an AudioParam or I could circumvent the issue by using a ramp. I've tried setting the position with and without a ramp on Chrome Canary and the issue is still present.
You can hear it for yourself here: https://jsfiddle.net/txLke4fh/
Code snippet:
var ctx = new AudioContext();
var osc = ctx.createOscillator();
var panner = ctx.createPanner();
var temp = true;
osc.frequency.value = 220;
osc.connect(panner);
panner.panningModel = 'HRTF';
panner.setPosition(0, 0, 0);
panner.connect(ctx.destination);
osc.start(0);
osc.stop(ctx.currentTime + 10);
setInterval(function() {
if (temp) {
panner.setPosition(50, 0, 0);
temp = false;
} else {
panner.setPosition(-50, 0, 0);
temp = true;
}
}, 100);
EDIT: It can be observed on Chrome Canary too, with and without a linear ramp.
var ctx = new AudioContext();
var osc = ctx.createOscillator();
var panner = ctx.createPanner();
var temp = true;
osc.frequency.value = 220;
osc.connect(panner);
panner.panningModel = 'HRTF';
panner.positionX.value = 0;
panner.connect(ctx.destination);
osc.start(0);
osc.stop(ctx.currentTime + 10);
setInterval(function() {
if (temp) {
panner.positionX.linearRampToValueAtTime(50, ctx.currentTime + 0.01);
temp = false;
} else {
panner.positionX.linearRampToValueAtTime(-50, ctx.currentTime + 0.01);
temp = true;
}
}, 1000);
You're doing an instantaneous move from one position to another. I certainly would expect a click, depending on how where you moved.
If you have Chrome canary, you should be able to use automation (but don't use setPosition() which doesn't do automation). If you have an example of where it still clicks with automation, please post it; I'd like to see such an example.

How target a movieClip in animate cc in this drag drop code

is there a way to modify this code for animate cc to make object in the stage and interact with it ?
it is a bit of pain to make drag and drop in createjs for animate cc
there is nothing in the web that describe how to do it for animate cc or flash cc even the documentation has nothing to tell about drag and drop in the canvas
//Stage
var stage = new createjs.Stage("demoCanvas");
//VARIABLES
//Drag Object Size
dragRadius = 40;
//Destination Size
destHeight = 100;
destWidth = 100;
//Circle Creation
var label = new createjs.Text("DRAG ME", "14px Lato", "#fff");
label.textAlign="center";
label.y -= 7;
var circle = new createjs.Shape();
circle.graphics.setStrokeStyle(2).beginStroke("black")
.beginFill("red").drawCircle(0,0, dragRadius);
//Drag Object Creation
//Placed inside a container to hold both label and shape
var dragger = new createjs.Container();
dragger.x = dragger.y = 100;
dragger.addChild(circle, label);
dragger.setBounds(100, 100, dragRadius*2, dragRadius*2);
//DragRadius * 2 because 2*r = width of the bounding box
var label2 = new createjs.Text("HERE", "bold 14px Lato", "#000");
label2.textAlign = "center";
label2.x += 50;
label2.y += 40;
var box = new createjs.Shape();
box.graphics.setStrokeStyle(2).beginStroke("black").rect(0, 0, destHeight, destWidth);
var destination = new createjs.Container();
destination.x = 350;
destination.y = 50;
destination.setBounds(350, 50, destHeight, destWidth);
destination.addChild(label2, box);
//DRAG FUNCTIONALITY =====================
dragger.on("pressmove", function(evt){
evt.currentTarget.x = evt.stageX;
evt.currentTarget.y = evt.stageY;
stage.update(); //much smoother because it refreshes the screen every pixel movement instead of the FPS set on the Ticker
if(intersect(evt.currentTarget, destination)){
evt.currentTarget.alpha=0.2;
box.graphics.clear();
box.graphics.setStrokeStyle(3)
.beginStroke("#0066A4")
.rect(0, 0, destHeight, destWidth);
}else{
evt.currentTarget.alpha=1;
box.graphics.clear(); box.graphics.setStrokeStyle(2).beginStroke("black").rect(0, 0, destHeight, destWidth);
}
});
//Mouse UP and SNAP====================
dragger.on("pressup", function(evt) {
if(intersect(evt.currentTarget, destination)){
dragger.x = destination.x + destWidth/2;
dragger.y = destination.y + destHeight/2;
dragger.alpha = 1;
box.graphics.clear();
box.graphics.setStrokeStyle(2).beginStroke("black").rect(0, 0, destHeight, destWidth);
stage.update(evt);
}
});
//Tests if two objects are intersecting
//Sees if obj1 passes through the first and last line of its
//bounding box in the x and y sectors
//Utilizes globalToLocal to get the x and y of obj1 in relation
//to obj2
//PRE: Must have bounds set for each object
//Post: Returns true or false
function intersect(obj1, obj2){
var objBounds1 = obj1.getBounds().clone();
var objBounds2 = obj2.getBounds().clone();
var pt = obj1.globalToLocal(objBounds2.x, objBounds2.y);
var h1 = -(objBounds1.height / 2 + objBounds2.height);
var h2 = objBounds2.width / 2;
var w1 = -(objBounds1.width / 2 + objBounds2.width);
var w2 = objBounds2.width / 2;
if(pt.x > w2 || pt.x < w1) return false;
if(pt.y > h2 || pt.y < h1) return false;
return true;
}
//Adds the object into stage
stage.addChild(destination, dragger);
stage.mouseMoveOutside = true;
stage.update();
thanks
I am not exactly sure what you are asking. The demo you showed works fine (looks like it came from this codepen), and it is not clear what you are trying to add. This demo was made directly in code, not with Animate CC - which is really good for building assets, animations, and display list structure, but you should write application code around what gets exported.
There are plenty of documentation and examples online for Drag and Drop, in the EaselJS GitHub, and EaselJS docs:
DragAndDrop demo in GitHub
Live demo on EaselJS demos page
Documentation on pressMove
Tutorial on Mouse Events which includes Drag and Drop
I recommend narrowing down what you are trying to do, show what code or approaches you have tried so far, and posting specific questions here.
Lastly, here is the first part of an ongoing series for working with Animate CC: http://blog.gskinner.com/archives/2015/04/introduction-to-the-flash-cc-html5-canvas-document.html
Cheers.

Unity3d stretch GUI.Box

I newby to Unity and I write a simple tic-tac-toe game for mobile devices.
I have troubles with GUI.Box. I try to make it stretch, but it does not work and text is clipped. My code:
GUIStyle lBoxStyle = new GUIStyle(GUI.skin.box);
lBoxStyle.stretchWidth = true;
lBoxStyle.stretchHeight = true;
lBoxStyle.wordWrap = true;
lBoxStyle.fontSize = 48;
lBoxStyle.normal.textColor = Color.black;
GUI.Box(new Rect((virtualWidth - mBoxWidth) / 2, (virtualHeight - mBoxHeight) / 2, mBoxWidth, mBoxHeight), mAlert, lBoxStyle);
How can I fix it?Also how I can reduce size if text is short?
First find out what is the size of the content with CalcSize. Then use that size to make the box tightly fitted around the content.
GUIStyle lBoxStyle = new GUIStyle(GUI.skin.box);
lBoxStyle.stretchWidth = true;
lBoxStyle.stretchHeight = true;
lBoxStyle.wordWrap = true;
lBoxStyle.fontSize = 48;
lBoxStyle.normal.textColor = Color.Black;
// Caculate the size of the content
Vector2 size = lBoxStyle.CalcSize(new GUIContent(mAlert));
// Padding if needed
// size += new Vector2(10, 10)
// Use the size as the size of the element
GUI.Box(new Rect((virtualWidth - size.x) / 2, (virtualHeight - size.y) / 2, size.x, size.y), mAlert, lBoxStyle);