In WPF, I get a tooltip to appear immediately like this:
TextBlock tb = new TextBlock();
tb.Text = name;
ToolTip tt = new ToolTip();
tt.Content = "This is some info on " + name + ".";
tb.ToolTip = tt;
tt.Cursor = Cursors.Help;
ToolTipService.SetInitialShowDelay(tb, 0);
This makes the user experience better since if the user wants to look at the tooltips of five items on the page, he doesn't have to wait that long second for each one.
But since Silverlight does not have SetInitialShowDelay, what is a workaround to make the tooltip appear immediately?
You'll need to hook the MouseEnter event and show it straight away yourself:-
TextBlock tb = new TextBlock();
tb.Text = name;
ToolTip tt = new ToolTip();
tt.Content = "This is some info on " + name + ".";
ToolTipService.SetToolTip(tb, tt);
tb.MouseEnter += (s, args) => {
((ToolTip)ToolTipService.GetToolTip((DependencyObject)s)).IsOpen = true;
};
Other than re-implementing the mouse enter (or the whole tooltip service), I'm afraid you might be out of luck - the delay you see is actually hard-coded into the "OnOwnerMouseEnter" method of the TooltipService:
(courtesy of Reflector)
TimeSpan span = (TimeSpan) (DateTime.Now - _lastToolTipOpenedTime);
if (TimeSpan.Compare(span, new TimeSpan(0, 0, 0, 0, 100)) <= 0)
{
OpenAutomaticToolTip(null, EventArgs.Empty);
}
else
{
if (_openTimer == null)
{
_openTimer = new DispatcherTimer();
_openTimer.Tick += new EventHandler(ToolTipService.OpenAutomaticToolTip);
}
_openTimer.Interval = new TimeSpan(0, 0, 0, 0, 400);
_openTimer.Start();
}
Related
Is it possible to animate the "old school" way, in codebehind, instead of xaml?
I just want an arrow that points to something with a 'bounce effect' which I could easily do in my own for loop. But I do not know how to refresh or do a timer delay, inside the loop. I already placed the image into position in codebehind. All I want to do is this simple animation...
public void validationArrow()
{
var validationArrow = new Image();
validationArrow.Source = new BitmapImage(new Uri("/SlProject;component/arrow.png", UriKind.RelativeOrAbsolute));
LayoutRoot.Children.Add(validationArrow);
validationArrow.Stretch = Stretch.None;
validationArrow.VerticalAlignment = System.Windows.VerticalAlignment.Top;
validationArrow.HorizontalAlignment = System.Windows.HorizontalAlignment.Left;
var arrowPosition = new TranslateTransform { X = 0, Y = 0 };
validationArrow.RenderTransform = arrowPosition;
validationArrow.Name = "validationArrow";
for (int i = 150; i >= 0; i--)
{
arrowPosition.X = i;
validationArrow.RenderTransform = arrowPosition;
// how can I refresh screen and do some timing here?
}
}
There's no school like the old school ;)
Here, this should help you on your way. You can play with the millisecond and Y translation values being passed to the BuildEasing method to change the 'bounce' effect's speed and distance.
private void RunStoryboard()
{
var arrowImage = new Image();
arrowImage.RenderTransform = new CompositeTransform();
arrowImage.Source = new BitmapImage(new Uri("/SlProject;component/arrow.png", UriKind.RelativeOrAbsolute));
LayoutRoot.Children.Add(arrowImage);
Storyboard storyboard = new Storyboard();
storyboard.Children.Add(BuildKeyFrame(arrowImage));
storyboard.Begin();
}
private DoubleAnimationUsingKeyFrames BuildKeyFrame(Image target)
{
DoubleAnimationUsingKeyFrames kf = new DoubleAnimationUsingKeyFrames();
Storyboard.SetTarget(kf, target);
Storyboard.SetTargetProperty(kf, new PropertyPath("(UIElement.RenderTransform).(CompositeTransform.TranslateY)"));
kf.KeyFrames.Add(BuildEasing(100, 10));
kf.KeyFrames.Add(BuildEasing(200, 0));
kf.KeyFrames.Add(BuildEasing(300, 10));
kf.KeyFrames.Add(BuildEasing(400, 0));
kf.KeyFrames.Add(BuildEasing(500, 10));
kf.KeyFrames.Add(BuildEasing(600, 0));
return kf;
}
private EasingDoubleKeyFrame BuildEasing(int ms, int value)
{
return new EasingDoubleKeyFrame()
{
KeyTime = KeyTime.FromTimeSpan(new TimeSpan(0, 0, 0, 0, ms)),
Value = value
};
}
I want to simply animate a text-box such that it fades in and also moves to the left (or any x/y position). How can I achieve that?
Also will it matter if it's inside a Grid?
Here's a sketchy method i just wrote for fading in any kind of UIElement:
public static void FadeIn(UIElement element, int xOffset, TimeSpan duration)
{
Transform tempTrans = element.RenderTransform;
TranslateTransform trans = new TranslateTransform(xOffset, 0);
TransformGroup group = new TransformGroup();
if (tempTrans != null) group.Children.Add(tempTrans);
group.Children.Add(trans);
DoubleAnimation animTranslate = new DoubleAnimation(0, (Duration)duration);
animTranslate.EasingFunction = new CubicEase() { EasingMode = EasingMode.EaseOut };
DoubleAnimation animFadeIn = new DoubleAnimation(0, 1, (Duration)duration) { FillBehavior = FillBehavior.Stop };
animTranslate.Completed += delegate
{
element.RenderTransform = tempTrans;
};
element.RenderTransform = trans;
element.BeginAnimation(UIElement.OpacityProperty, animFadeIn);
trans.BeginAnimation(TranslateTransform.XProperty, animTranslate);
}
If some of the workings are not clear feel free to ask.
It seems not all bindings are to evaluated when printing. For example, in the code below, only the first button has content = "100", other buttons have content = "0".
var doc = new XpsDocument("test.xps",FileAccess.Write);
var writer = XpsDocument.CreateXpsDocumentWriter(doc);
var collator = writer.CreateVisualsCollator();
collator.BeginBatchWrite();
for (int i = 0; i < 3; i++)
{
var button = new Button();
button.SetBinding(ContentControl.ContentProperty,
new Binding
{
RelativeSource = new RelativeSource(RelativeSourceMode.Self),
Path = new PropertyPath("ActualWidth")
});
button.Measure(new Size(100, 100));
button.Arrange(new Rect(0, 0, 100, 100));
button.Width = 100;
button.Height = 100;
collator.Write(button);
}
collator.EndBatchWrite();
doc.Close();
Is there a workaround?
For example, is there a way to force the binding to evaluate?
Have you tried making sure the dispatcher is idle before the call to collator.EndBatchWrite().
Something like:
Dispatcher.CurrentDispatcher.Invoke(
new Action( delegate { } ), DispatcherPriority.ApplicationIdle, null );
I worked out the C# code to create an ImageButton (below) that has three images (one base-image and two overlays) and three text boxes as the face of the button. I am inheriting from the Button class, which unfortunately includes several components that I didn't realize would surface until after coding and need to remove, namely the bright-blue surrounding border on IsMouseOver, and any visible borders between the buttons, as the buttons will end up in a wrapPanel and the borders need to be seamless. Now that the format has been worked out in C#, I expect that I need to translate to XAML so that I can create a ControlTemplate to get the functionality necessary, however I am not certain as to the process of translating from C# to XAML. I would appreciate if anyone is aware of a good overview/resource that discusses what will be required to convert so that I can translate appropriately? Thanks.
public class ACover : Button
{
Image cAImage = null;
Image jCImage = null;
Image jCImageOverlay = null;
TextBlock ATextBlock = null;
TextBlock AbTextBlock = null;
TextBlock RDTextBlock = null;
private string _TracksXML = "";
public ACover()
{
Grid cArtGrid = new Grid();
cArtGrid.Background = new SolidColorBrush(Color.FromRgb(38, 44, 64));
cArtGrid.Margin = new System.Windows.Thickness(5, 10, 5, 10);
RowDefinition row1 = new RowDefinition();
row1.Height = new GridLength(225);
RowDefinition row2 = new RowDefinition();
row2.Height = new GridLength(0, GridUnitType.Auto);
RowDefinition row3 = new RowDefinition();
row3.Height = new GridLength(0, GridUnitType.Auto);
RowDefinition row4 = new RowDefinition();
row4.Height = new GridLength(0, GridUnitType.Auto);
cArtGrid.RowDefinitions.Add(row1);
cArtGrid.RowDefinitions.Add(row2);
cArtGrid.RowDefinitions.Add(row3);
cArtGrid.RowDefinitions.Add(row4);
ColumnDefinition col1 = new ColumnDefinition();
col1.Width = new GridLength(0, GridUnitType.Auto);
cArtGrid.ColumnDefinitions.Add(col1);
jCImage = new Image();
jCImage.Height = 240;
jCImage.Width = 260;
jCImage.VerticalAlignment = VerticalAlignment.Top;
jCImage.Source = new BitmapImage(new Uri(Properties.Settings.Default.pathToGridImages + "jc.png", UriKind.Absolute));
cArtGrid.Children.Add(jCImage);
cArtImage = new Image();
cArtImage.Height = 192;
cArtImage.Width = 192;
cArtImage.Margin = new System.Windows.Thickness(3, 7, 0, 0);
cArtImage.VerticalAlignment = VerticalAlignment.Top;
cArtGrid.Children.Add(cArtImage);
jCImageOverlay = new Image();
jCImageOverlay.Height = 192;
jCImageOverlay.Width = 192;
jCImageOverlay.Margin = new System.Windows.Thickness(3, 7, 0, 0);
jCImageOverlay.VerticalAlignment = VerticalAlignment.Top;
jCImageOverlay.Source = new BitmapImage(new Uri( Properties.Settings.Default.pathToGridImages + "jc-overlay.png", UriKind.Absolute));
cArtGrid.Children.Add(jCImageOverlay);
ATextBlock = new TextBlock();
ATextBlock.Foreground = new SolidColorBrush(Color.FromRgb(173, 176, 198));
ATextBlock.Margin = new Thickness(10, -10, 0, 0);
cArtGrid.Children.Add(ATextBlock);
AlTextBlock = new TextBlock();
AlTextBlock.Margin = new Thickness(10, 0, 0, 0);
AlTextBlock.Foreground = new SolidColorBrush(Color.FromRgb(173, 176, 198));
cArtGrid.Children.Add(AlTextBlock);
RDTextBlock = new TextBlock();
RDTextBlock.Margin = new Thickness(10, 0, 0, 0);
RDTextBlock.Foreground = new SolidColorBrush(Color.FromRgb(173, 176, 198));
cArtGrid.Children.Add(RDTextBlock);
Grid.SetColumn(jCImage, 0);
Grid.SetRow(jCImage, 0);
Grid.SetColumn(jCImageOverlay, 0);
Grid.SetRow(jCImageOverlay, 0);
Grid.SetColumn(cArtImage, 0);
Grid.SetRow(cArtImage, 0);
Grid.SetColumn(ATextBlock, 0);
Grid.SetRow(ATextBlock, 1);
Grid.SetColumn(AlTextBlock, 0);
Grid.SetRow(AlTextBlock, 2);
Grid.SetColumn(RDTextBlock, 0);
Grid.SetRow(RDTextBlock, 3);
this.Content = cArtGrid;
}
public string A
{
get { if (ATextBlock != null) return ATextBlock.Text;
else return String.Empty; }
set { if (ATextBlock != null) ATextBlock.Text = value; }
}
public string Al
{
get { if (AlTextBlock != null) return AlTextBlock.Text;
else return String.Empty; }
set { if (AlTextBlock != null) AlTextBlock.Text = value; }
}
public string RD
{
get { if (RDTextBlock != null) return RDTextBlock.Text;
else return String.Empty; }
set { if (RDTextBlock != null) RDTextBlock.Text = value; }
}
public ImageSource Image
{
get { if (cArtImage != null) return cArtImage.Source;
else return null; }
set { if (cArtImage != null) cArtImage.Source = value; }
}
public string TracksXML
{
get { return _TracksXML; }
set { _TracksXML = value; }
}
public double ImageWidth
{
get { if (cArtImage != null) return cArtImage.Width;
else return double.NaN; }
set { if (cArtImage != null) cArtImage.Width = value; }
}
public double ImageHeight
{
get { if (cArtImage != null) return cArtImage.Height;
else return double.NaN; }
set { if (cArtImage != null) cArtImage.Height = value; }
}
}
XAML basically represents an object graph, so the translation should normally be pretty mechanical:
C# new translates to a XAML element tag, e.g. Grid cArtGrid = new Grid(); translates to <Grid Name="cArtGrid"></Grid>.
C# property setters translate to attributes if the value is simple, e.g. cArtGrid.Background = new SolidColorBrush(Color.FromRgb(38, 44, 64)); translates to <Grid Background="#FF262C40">.
If the property value is complex, you'll need to use XAML property element syntax.
Adding to collections typically requires XAML property element syntax, e.g. <Grid><Grid.RowDefinitions><RowDefinition Height="225" /></Grid.RowDefinitions></Grid>.
But for the Children collection you can just put the element directly inside e.g. cArtGrid.Children.Add(jCImage); becomes <Grid><Image ... /></Grid>. (The same applies to the Content property though this won't really affect you here.)
Attached property SetXxx calls translate into attributes with the dot notation e.g. Grid.SetColumn(ATextBlock, 0); becomes <Grid><TextBlock Grid.Column="0" /></Grid>.
You'll need to understand how value types like colours and thicknesses are represented e.g. the #AARRGGBB notation for colours and the CSV notation for thicknesses. MSDN will usually show this for the relevant types or properties that have those types.
In general, looking up the property in MSDN and looking at the XAML syntax should give you a good start.
It sounds like you're attempting to extend the button with some new functionality. So the first thing you want to do is take advantage of the dependency system so that your properties can be bound in XAML. Look at this article on MSDN for information on declaring new dependency properties.
A prime candidate for a dependency property would be the Image property.
Actually, what I recommend is using the new CustomControl template in visual studio to provide some boilerplate code for you. Part of the boilerplate is declaring a themes.xaml file which provides a default template for your control. That template is what will hold your translated XAML for your control.
The good thing about XAML is that it is an initialization language. Once you get the dependency properties declared on your AlbumCover you bind to them in the template for your control. For more details about how this works, look at Charles Petzold's article on creating lookless controls in WPF.
You've got the basic look and functionality for your control in place. Following these two resources should help you integrate within the WPF ecosystem.
I'm trying to fade in a new control to my application's "app" area which is programmatically added after the existing controls are removed. My code looks like this:
void settingsButton_Clicked(object sender, EventArgs e)
{
ContentCanvas.Children.Clear();
// Fade in settings panel
NameScope.SetNameScope(this, new NameScope());
SettingsPane s = new SettingsPane();
s.Name = "settingsPane";
this.RegisterName(s.Name, s);
this.Resources.Add(s.Name, s);
Storyboard sb = new Storyboard();
DoubleAnimation settingsFade = new DoubleAnimation();
settingsFade.From = 0;
settingsFade.To = 1;
settingsFade.Duration = new Duration(TimeSpan.FromSeconds(0.33));
settingsFade.RepeatBehavior = new RepeatBehavior(1);
Storyboard.SetTargetName(settingsFade, s.Name);
Storyboard.SetTargetProperty(settingsFade, new PropertyPath(UserControl.OpacityProperty));
ContentCanvas.Children.Add(s);
sb.Children.Add(settingsFade);
sb.Begin();
}
However, when I run this code, I get the error "No applicable name scope exists to resolve the name 'settingsPane'."
What am I possibly doing wrong? I'm pretty sure I've registered everything properly :(
I wouldn't hassle with the NameScopes etc. and would rather use Storyboard.SetTarget instead.
var b = new Button() { Content = "abcd" };
stack.Children.Add(b);
var fade = new DoubleAnimation()
{
From = 0,
To = 1,
Duration = TimeSpan.FromSeconds(5),
};
Storyboard.SetTarget(fade, b);
Storyboard.SetTargetProperty(fade, new PropertyPath(Button.OpacityProperty));
var sb = new Storyboard();
sb.Children.Add(fade);
sb.Begin();
I solved the problem using this as parameter in the begin method, try:
sb.Begin(this);
Because the name is registered in the window.
I agree, the namescopes are probably the wrong thing to use for this scenario. Much simpler and easier to use SetTarget rather than SetTargetName.
In case it helps anyone else, here's what I used to highlight a particular cell in a table with a highlight that decays to nothing. It's a little like the StackOverflow highlight when you add a new answer.
TableCell cell = table.RowGroups[0].Rows[row].Cells[col];
// The cell contains just one paragraph; it is the first block
Paragraph p = (Paragraph)cell.Blocks.FirstBlock;
// Animate the paragraph: fade the background from Yellow to White,
// once, through a span of 6 seconds.
SolidColorBrush brush = new SolidColorBrush(Colors.Yellow);
p.Background = brush;
ColorAnimation ca1 = new ColorAnimation()
{
From = Colors.Yellow,
To = Colors.White,
Duration = new Duration(TimeSpan.FromSeconds(6.0)),
RepeatBehavior = new RepeatBehavior(1),
AutoReverse = false,
};
brush.BeginAnimation(SolidColorBrush.ColorProperty, ca1);
It is possible odd thing but my solution is to use both methods:
Storyboard.SetTargetName(DA, myObjectName);
Storyboard.SetTarget(DA, myRect);
sb.Begin(this);
In this case there is no error.
Have a look at the code where I have used it.
int n = 0;
bool isWorking;
Storyboard sb;
string myObjectName;
UIElement myElement;
int idx = 0;
void timer_Tick(object sender, EventArgs e)
{
if (isWorking == false)
{
isWorking = true;
try
{
myElement = stackObj.Children[idx];
var possibleIDX = idx + 1;
if (possibleIDX == stackObj.Children.Count)
idx = 0;
else
idx++;
var myRect = (Rectangle)myElement;
// Debug.WriteLine("TICK: " + myRect.Name);
var dur = TimeSpan.FromMilliseconds(2000);
var f = CreateVisibility(dur, myElement, false);
sb.Children.Add(f);
Duration d = TimeSpan.FromSeconds(2);
DoubleAnimation DA = new DoubleAnimation() { From = 1, To = 0, Duration = d };
sb.Children.Add(DA);
myObjectName = myRect.Name;
Storyboard.SetTargetName(DA, myObjectName);
Storyboard.SetTarget(DA, myRect);
Storyboard.SetTargetProperty(DA, new PropertyPath("Opacity"));
sb.Begin(this);
n++;
}
catch (Exception ex)
{
Debug.WriteLine(ex.Message + " " + DateTime.Now.TimeOfDay);
}
isWorking = false;
}
}