private void Selector_UpdateSelectedState(AppSelectorButton sbButton)
{
foreach (AppSelectorButton button in _buttonList)
{
if (((Panel)button.Content).Children[2] is TextBlockEx)
{
TextBlockEx text = (TextBlockEx)((Panel)button.Content).Children[2];
if (button.ID == sbButton.ID)
{
text.ShowBoldText(true);
//if (IsListView)
//{
// button.Background = new SolidColorBrush(Colors.Blue);
//}
}
else
{
text.ShowBoldText(false);
//if (IsListView)
//{
// button.Background = button.NormalBackground;
//}
}
}
}
}
private TextBlockEx CreateWord(string name, string text)
{
TextBlockEx _textBlock = new TextBlockEx()
{
Name = name,
Text = text,
TextStyle = this.TextStyle,
Margin = StyleHelper.GetApplicationThickness(LayoutThicknesses.HeroMargin),
Opacity = 0d
};
return(_textBlock);
}
private void RenderUI()
{
// get the layoutroot
_layoutRoot = (Grid)this.GetTemplateChild("LayoutRoot");
if (null == _layoutRoot)
{
return;
}
// clear any children
_layoutRoot.Children.Clear();
// get our sizes
double arrowWidth = StyleHelper.GetApplicationDouble(LayoutSizes.SwipeToContinueArrowWidth);
double spacer = StyleHelper.GetApplicationDouble(LayoutSizes.SwipeToContinueSpacer);
// set up grid
_layoutRoot.RowDefinitions.Add(new RowDefinition()
{
Height = GridLength.Auto
});
_layoutRoot.ColumnDefinitions.Add(new ColumnDefinition()
{
Width = new GridLength(arrowWidth)
});
_layoutRoot.ColumnDefinitions.Add(new ColumnDefinition()
{
Width = new GridLength(arrowWidth)
});
_layoutRoot.ColumnDefinitions.Add(new ColumnDefinition()
{
Width = new GridLength(arrowWidth)
});
_layoutRoot.ColumnDefinitions.Add(new ColumnDefinition()
{
Width = new GridLength(arrowWidth)
});
_layoutRoot.ColumnDefinitions.Add(new ColumnDefinition()
{
Width = new GridLength(arrowWidth)
});
_layoutRoot.ColumnDefinitions.Add(new ColumnDefinition()
{
Width = new GridLength(spacer)
});
_layoutRoot.ColumnDefinitions.Add(new ColumnDefinition()
{
Width = GridLength.Auto
});
// add a translate transform to the layout root
_translateGrid = new TranslateTransform()
{
X = 0
};
_layoutRoot.RenderTransform = _translateGrid;
// manipulation mode
_layoutRoot.ManipulationMode = ManipulationModes.TranslateRailsX;
// attach to the manipulation events
_layoutRoot.ManipulationStarted += Grid_ManipulationStarted;
_layoutRoot.ManipulationDelta += Grid_ManipulationDelta;
_layoutRoot.ManipulationCompleted += Grid_ManipulationCompleted;
// create arrow bitmap
_arrowBitmapImage = new BitmapImage()
{
UriSource = new Uri(ARROW_URI),
DecodePixelWidth = (int)arrowWidth,
};
// create arrows
_arrowLeftmost = new Image()
{
Width = arrowWidth,
Opacity = 0.0,
Source = _arrowBitmapImage
};
Grid.SetRow(_arrowLeftmost, 0);
Grid.SetColumn(_arrowLeftmost, 0);
_layoutRoot.Children.Add(_arrowLeftmost);
_arrowLeft = new Image()
{
Width = arrowWidth,
Opacity = 0.0,
Source = _arrowBitmapImage
};
Grid.SetRow(_arrowLeft, 0);
Grid.SetColumn(_arrowLeft, 1);
_layoutRoot.Children.Add(_arrowLeft);
_arrowMiddle = new Image()
{
Width = arrowWidth,
Opacity = 0.0,
Source = _arrowBitmapImage
};
Grid.SetRow(_arrowMiddle, 0);
Grid.SetColumn(_arrowMiddle, 2);
_layoutRoot.Children.Add(_arrowMiddle);
_arrowRight = new Image()
{
Width = arrowWidth,
Opacity = 0.0,
Source = _arrowBitmapImage
};
Grid.SetRow(_arrowRight, 0);
Grid.SetColumn(_arrowRight, 3);
_layoutRoot.Children.Add(_arrowRight);
_arrowRightmost = new Image()
{
Width = arrowWidth,
Opacity = 0.0,
Source = _arrowBitmapImage
};
Grid.SetRow(_arrowRightmost, 0);
Grid.SetColumn(_arrowRightmost, 4);
_layoutRoot.Children.Add(_arrowRightmost);
// create textblock
_textSwipe = new TextBlockEx()
{
TextStyle = TextStyles.Swipe,
HorizontalAlignment = HorizontalAlignment.Left,
VerticalAlignment = VerticalAlignment.Center,
Opacity = 0.0,
};
_textSwipe.SetBinding(TextBlockEx.TextProperty,
new Binding()
{
Source = this, Path = new PropertyPath("SwipeText"), Mode = BindingMode.OneWay
});
Grid.SetRow(_textSwipe, 0);
Grid.SetColumn(_textSwipe, 6);
_layoutRoot.Children.Add(_textSwipe);
// animation calculations
double staggerDelayIn = ANIM_STAGGER_TEXT;
// text fade in
_storyboardText = AnimationHelper.CreateEasingAnimation(_textSwipe, "(UIElement.Opacity)", 0.0, 0.0, 1.0, null, null, ANIM_FADEIN_TEXT, staggerDelayIn, false, false, new RepeatBehavior(1d));
staggerDelayIn += ANIM_FADEIN_TEXT + ANIM_STAGGER_FIRSTARROW;
// right most arrow fade in
_storyboardRightmostArrow = AnimationHelper.CreateEasingAnimation(_arrowRightmost, "(UIElement.Opacity)", 0.0, 0.0, 1.0, null, null, ANIM_FADEIN_ARROW, staggerDelayIn, false, false, new RepeatBehavior(1d));
staggerDelayIn += ANIM_FADEIN_ARROW + ANIM_STAGGER_NEXTARROWS + ANIM_REST_ARROW;
// right arrow fade in
_storyboardRightArrow = AnimationHelper.CreateEasingAnimation(_arrowRight, "(UIElement.Opacity)", 0.0, 0.0, 1.0, null, null, ANIM_FADEIN_ARROW, staggerDelayIn, false, false, new RepeatBehavior(1d));
staggerDelayIn += ANIM_FADEIN_ARROW + ANIM_STAGGER_NEXTARROWS + ANIM_REST_ARROW;
// middle arrow fade in
_storyboardMiddleArrow = AnimationHelper.CreateEasingAnimation(_arrowMiddle, "(UIElement.Opacity)", 0.0, 0.0, 1.0, null, null, ANIM_FADEIN_ARROW, staggerDelayIn, false, false, new RepeatBehavior(1d));
staggerDelayIn += ANIM_FADEIN_ARROW + ANIM_STAGGER_NEXTARROWS + ANIM_REST_ARROW;
// left arrow fade in
_storyboardLeftArrow = AnimationHelper.CreateEasingAnimation(_arrowLeft, "(UIElement.Opacity)", 0.0, 0.0, 1.0, null, null, ANIM_FADEIN_ARROW, staggerDelayIn, false, false, new RepeatBehavior(1d));
staggerDelayIn += ANIM_FADEIN_ARROW + ANIM_STAGGER_NEXTARROWS + ANIM_REST_ARROW;
// left most arrow fade in
_storyboardLeftmostArrow = AnimationHelper.CreateEasingAnimation(_arrowLeftmost, "(UIElement.Opacity)", 0.0, 0.0, 1.0, null, null, ANIM_FADEIN_ARROW, staggerDelayIn, false, false, new RepeatBehavior(1d));
staggerDelayIn += ANIM_FADEIN_ARROW + ANIM_STAGGER_NEXTARROWS + ANIM_REST_ARROW;
//// set up fade animations
//_storyboardFadeIn = AnimationHelper.CreateStandardEasingAnimation(_layoutRoot, "Opacity", 0.0, 0.0, 1.0, 100d, 0d, false, false, new RepeatBehavior(1d));
//_storyboardFadeOut = AnimationHelper.CreateStandardEasingAnimation(_layoutRoot, "Opacity", 1.0, 1.0, 0.0, 100d, 0d, false, false, new RepeatBehavior(1d));
}
private void GenerateButton(ImagePair imagePair, int i, int position)
{
Grid grid = new Grid()
{
Margin = new Thickness(0),
Padding = new Thickness(0)
};
if (this.ShowMessages && this.MainOrientation == Orientation.Vertical)
{
grid.ColumnDefinitions.Add(new ColumnDefinition()
{
Width = new GridLength(.5, GridUnitType.Star)
});
grid.ColumnDefinitions.Add(new ColumnDefinition()
{
Width = new GridLength(.5, GridUnitType.Star)
});
grid.ColumnSpacing = WIDTH_GRID_COLUMNSPACING;
}
Grid.SetRow(imagePair.NotSelected, 0);
Grid.SetColumn(imagePair.NotSelected, 0);
grid.Children.Add(imagePair.NotSelected);
Grid.SetRow(imagePair.Selected, 0);
Grid.SetColumn(imagePair.Selected, 0);
grid.Children.Add(imagePair.Selected);
HorizontalAlignment horizontalAlignment = HorizontalAlignment.Center;
// if we need to show messages then align left
if (this.MainOrientation == Orientation.Vertical && this.ShowMessages && !string.IsNullOrWhiteSpace(imagePair.Message))
{
horizontalAlignment = HorizontalAlignment.Left;
TextBlockEx tbMessage = new TextBlockEx()
{
Name = "TheText",
Text = imagePair.Message,
TextStyle = TextStyles.AppSelectorText,
FontSize = 20,
Opacity = 1,
VerticalAlignment = VerticalAlignment.Center,
TextStyleBold = TextStyles.AppSelectorTextBold
};
if (i == 0)
{
tbMessage.ShowBoldText(true);
}
Grid.SetRow(tbMessage, 0);
Grid.SetColumn(tbMessage, 1);// kk this isnt working just yet.
grid.Children.Add(tbMessage);
}
AppSelectorButton sbButton = new AppSelectorButton()
{
ID = i,
HorizontalAlignment = horizontalAlignment,
VerticalAlignment = VerticalAlignment.Center,
Content = grid
};
//if (!IsListView)
//{
// sbButton.Background = new SolidColorBrush(Colors.Transparent);
//}
//else
//{
// sbButton.NormalBackground = (i % 2 == 0 ? BackGroundWhiteAcrylic : BackGroundGrayAcrylic);
// if (i == 0)
// {
// sbButton.Background = new SolidColorBrush(Colors.Blue);
// }
// else
// {
// sbButton.Background = sbButton.NormalBackground;
// }
//}
//only set the dimensions of the button if the control variables are passed in
// and the orientation is correct
if (this.ButtonHeight > 0)
{
sbButton.Height = this.ButtonHeight;
}
// if u need to show messages, dont set the width b/c theres no way to figure out the width
// if there is text
if (this.ButtonWidth > 0 && (!this.ShowMessages && !(this.MainOrientation == Orientation.Vertical)))
{
sbButton.Width = this.ButtonWidth;
}
if (null != _buttonStyle)
{
sbButton.Style = _buttonStyle;
}
;
if (imagePair.IsClearButton)
{// these buttons get their own handler and dont change the selection of the app selector
sbButton.AddHandler(PointerReleasedEvent, new PointerEventHandler(Selector_ClearButtonClick), true);
}
else
{
sbButton.AddHandler(PointerReleasedEvent, new PointerEventHandler(Selector_ButtonClick), true);
}
grid.PointerEntered += pointerEntered;
if (this.MainOrientation == Orientation.Horizontal)
{
Grid.SetRow(sbButton, 0);
Grid.SetColumn(sbButton, position);
}
else // vertical
{
Grid.SetColumn(sbButton, 0);
Grid.SetRow(sbButton, position);
}
if (!imagePair.IsClearButton)
{// clear button is not a part of the regular buttons
this.Buttons.Add(sbButton);
}
_layoutRoot.Children.Add(sbButton);
_buttonList.Add(sbButton);
}
private void GenerateButton(AppSelectorData AppSelectorData, int index)
{
btnGrid = new Grid()
{
Margin = new Thickness(0),
Padding = new Thickness(0)
};
if (this.ShowMessages && this.MainOrientation == Orientation.Vertical)
{
btnGrid.ColumnDefinitions.Add(new ColumnDefinition()
{
Width = new GridLength(.5, GridUnitType.Star)
});
btnGrid.ColumnDefinitions.Add(new ColumnDefinition()
{
Width = new GridLength(.5, GridUnitType.Star)
});
btnGrid.ColumnSpacing = WIDTH_GRID_COLUMNSPACING;
}
ImagePair images = new ImagePair()
{
//ID = i,
Selected = new Image()
{
Width = this.ButtonWidth,
HorizontalAlignment = HorizontalAlignment.Center,
VerticalAlignment = VerticalAlignment.Center,
Opacity = 1.0
},
NotSelected = new Image()
{
Width = this.ButtonWidth,
HorizontalAlignment = HorizontalAlignment.Center,
VerticalAlignment = VerticalAlignment.Center,
Opacity = 1.0
}
};
if (!string.IsNullOrEmpty(AppSelectorData.Source_NotSelectedImage))
{
images.NotSelected.Source = new BitmapImage()
{
UriSource = new Uri(AppSelectorData.Source_NotSelectedImage), DecodePixelWidth = (int)this.ButtonWidth
};
}
else if (!string.IsNullOrEmpty(AppSelectorData.SourceSVG_NotSelectedImage))
{
images.NotSelected.Source = new SvgImageSource(new Uri(AppSelectorData.SourceSVG_NotSelectedImage));
}
if (!string.IsNullOrEmpty(AppSelectorData.Source_SelectedImage))
{
images.Selected.Source = new BitmapImage()
{
UriSource = new Uri(AppSelectorData.Source_SelectedImage), DecodePixelWidth = (int)this.ButtonWidth
};
}
else if (!string.IsNullOrEmpty(AppSelectorData.SourceSVG_SelectedImage))
{
images.Selected.Source = new SvgImageSource(new Uri(AppSelectorData.SourceSVG_SelectedImage));
}
//images.Selected.Source
Grid.SetRow(images.NotSelected, 0);
Grid.SetColumn(images.NotSelected, 0);
btnGrid.Children.Add(images.NotSelected);
Grid.SetRow(images.Selected, 0);
Grid.SetColumn(images.Selected, 0);
btnGrid.Children.Add(images.Selected);
if (this.MainOrientation == Orientation.Vertical && this.ShowMessages)
{
TextBlockEx tbMessage = new TextBlockEx()
{
Name = "Text",
Text = AppSelectorData.Message,
TextStyle = TextStyles.AppSelectorText,
FontSize = 20,
Opacity = 1,
VerticalAlignment = VerticalAlignment.Center,
TextStyleBold = TextStyles.AppSelectorTextBold
//TextStyleBold = (IsListView ? TextStyles.AppSelectorTextDarkBold: TextStyles.AppSelectorTextBold)
};
if (index == 0)
{
tbMessage.ShowBoldText(true);
}
Grid.SetRow(tbMessage, 0);
Grid.SetColumn(tbMessage, 1);// kk this isnt working just yet.
btnGrid.Children.Add(tbMessage);
}
if (!AppSelectorData.IsClearButton)
{
this.ImagePairs.Add(index, images);
}
HorizontalAlignment horizontalAlignment = HorizontalAlignment.Center;
// if we need to show messages then align left
if (this.MainOrientation == Orientation.Vertical && this.ShowMessages)
{
horizontalAlignment = HorizontalAlignment.Left;
}
AppSelectorButton sbButton = new AppSelectorButton()
{
ID = index,
Background = new SolidColorBrush(Colors.Transparent),
HorizontalAlignment = horizontalAlignment,
VerticalAlignment = VerticalAlignment.Center,
Content = btnGrid
};
//if (!IsListView)
//{
// sbButton.Background = new SolidColorBrush(Colors.Transparent);
//}
//else
//{
// sbButton.NormalBackground = (index % 2 == 0 ? BackGroundWhiteAcrylic : BackGroundGrayAcrylic);
// if (index == 0)
// {
// sbButton.Background = new SolidColorBrush(Colors.Blue);
// }
// else
// {
// sbButton.Background = sbButton.NormalBackground;
// }
//}
//only set the dimensions of the button if the control variables are passed in
// and the orientation is correct
if (this.ButtonHeight > 0)
{
sbButton.Height = this.ButtonHeight;
}
// if u need to show messages, dont set the width b/c theres no way to figure out the width
// if there is text
if (this.ButtonWidth > 0 && (!this.ShowMessages && !(this.MainOrientation == Orientation.Vertical)))
{
sbButton.Width = this.ButtonWidth;
}
if (null != _buttonStyle)
{
sbButton.Style = _buttonStyle;
}
;
if (AppSelectorData.IsClearButton)
{// these buttons get their own handler and dont change the selection of the app selector
sbButton.AddHandler(PointerReleasedEvent, new PointerEventHandler(Selector_ClearButtonClick), true);
}
else
{
sbButton.AddHandler(PointerReleasedEvent, new PointerEventHandler(Selector_ButtonClick), true);
}
btnGrid.PointerEntered += pointerEntered;
if (this.MainOrientation == Orientation.Horizontal)
{
Grid.SetRow(sbButton, 0);
Grid.SetColumn(sbButton, index);
}
else // vertical
{
Grid.SetColumn(sbButton, 0);
Grid.SetRow(sbButton, index);
}
if (!AppSelectorData.IsClearButton)
{// clear button is not a part of the regular buttons
this.Buttons.Add(sbButton);
}
_layoutRoot.Children.Add(sbButton);
_buttonList.Add(sbButton);
}
private void RenderUI()
{
// get the master row container
_rowMaster = (StackPanel)this.GetTemplateChild("RowMaster");
// exit if we can't find it
if (null == _rowMaster)
{
return;
}
// clear the children
_rowMaster.Children.Clear();
int _rowCount = 0;
// create rows
for (int row = 0; row < this.WordRows; row++)
{
// create row stackpanel and add to the master
StackPanel stackPanel = new StackPanel()
{
Orientation = Orientation.Horizontal,
HorizontalAlignment = HorizontalAlignment.Center,
};
_rowMaster.Children.Add(stackPanel);
_rowCount++;
}
// break the words into text blocks
List <string> words = this.Words.Split(" ").ToList <string>();
// calculate word positions;
int wordsPerLine = words.Count / this.WordRows;
int wordsLeftover = words.Count - (wordsPerLine * this.WordRows);
int wordIndex = 0;
//// loop through the rows
for (int i = 0; i < _rowCount; i++)
{
StackPanel row = (StackPanel)_rowMaster.Children[i];
//foreach (StackPanel row in _rowMaster.Children)
//{
int wordsThisLine = wordsPerLine;
if (i == _rowCount - 1 && wordsLeftover > 0)
{
wordsThisLine++;
wordsLeftover--;
}
for (int k = 0; k < wordsThisLine; k++)
{
// get the word
string word = words.ElementAt(wordIndex);
// create the name
string name = String.Format("Word_{0}", wordIndex);
// create the textblock
TextBlockEx textBlockWord = CreateWord(name, word);
// save it to reset opacity for animation
_wordTextBlocks.Add(textBlockWord);
// add it to the row
row.Children.Add(textBlockWord);
// increment the word index
wordIndex++;
}
}
// animation index
int animationIndex = 0;
// loop through the words to animate them
foreach (TextBlockEx textBlockEx in _wordTextBlocks)
{
double staggerDelay = this.StaggerDelayMilliseconds + (animationIndex * this.DurationPerWordInMilliseconds);
_storyboards.Add(
AnimationHelper.CreateStandardAnimation(textBlockEx, "(TextBlockEx.Opacity)", 0.0, 0.0, 1.0,
this.DurationPerWordInMilliseconds, staggerDelay, false, false, new RepeatBehavior(1d)));
animationIndex++;
}
}
private void RenderUI()
{
// get the layoutroot
_layoutRoot = (Border)this.GetTemplateChild("LayoutRoot");
if (null == _layoutRoot)
{
return;
}
// clear its children
_layoutRoot.Child = null;
// calculate element widths
double gridWidth = this.Width;
// calculate rows
GridLength headlineRowHeight = (String.IsNullOrWhiteSpace(this.Headline)) ? new GridLength(0) : GridLength.Auto;
GridLength ledeRowHeight = (String.IsNullOrWhiteSpace(this.Lede)) ? new GridLength(0) : new GridLength(1.0, GridUnitType.Star);
double rowSpacing = (String.IsNullOrWhiteSpace(this.Headline) || String.IsNullOrWhiteSpace(this.Lede)) || !this.IsRowSpacingActive ? 0d : 10d;
// create the grid
_layoutGrid = new Grid()
{
Name = "LayoutGrid",
Width = gridWidth,
RowSpacing = rowSpacing
};
_layoutGrid.RowDefinitions.Add(new RowDefinition()
{
Height = headlineRowHeight
});
_layoutGrid.RowDefinitions.Add(new RowDefinition()
{
Height = ledeRowHeight
});
_layoutGrid.ColumnDefinitions.Add(new ColumnDefinition());
// add it to the root
_layoutRoot.Child = _layoutGrid;
// if we have a headline
if (!String.IsNullOrWhiteSpace(this.Headline))
{
// create headline
// =================
_headline = new TextBlockEx()
{
Name = "Headline",
TextAlignment = this.HeaderAlignment,
TextWrapping = TextWrapping.WrapWholeWords,
Width = gridWidth,
TextStyle = this.HeadlineStyle,
TranslateDirection = this.Direction(),
Opacity = this.HeadlineOpacity
};
Grid.SetRow(_headline, 0);
Grid.SetColumn(_headline, 0);
// set headline binding
_headline.SetBinding(TextBlockEx.TextProperty,
new Binding()
{
Source = this, Path = new PropertyPath("Headline"), Mode = BindingMode.OneWay
});
// add to the grid
_layoutGrid.Children.Add(_headline);
//// update layout
//this.UpdateLayout();
}
// if we have a lede
if (!String.IsNullOrWhiteSpace(this.Lede))
{
double _ledeWidth = this.LedeWidth > 0 ? LedeWidth : gridWidth;
// create lede
// =================
_lede = new TextBlockEx()
{
Name = "Lede",
TextAlignment = this.HeaderAlignment,
TextWrapping = TextWrapping.WrapWholeWords,
Width = _ledeWidth,
TextStyle = this.LedeStyle,
HorizontalAlignment = this.HorizontalAlignment,
TranslateDirection = this.Direction(),
Opacity = this.LedeOpacity
};
Grid.SetRow(_lede, 1);
Grid.SetColumn(_lede, 0);
// if there's a call to action
if ((!String.IsNullOrWhiteSpace(this.CTAText)) && (null != this.CTAUri))
{
// get style for the cta run
Style ledeStyle = StyleHelper.GetApplicationStyle(this.LedeStyle);
Style ctaStyle = StyleHelper.GetApplicationStyle(this.CTATextStyle);
// create the lede
_ledeRun = new Run()
{
Text = this.Lede + CHAR_NBSPACE + CHAR_NBSPACE
};
StyleHelper.SetRunStyleFromStyle(_ledeRun, ledeStyle);
_lede.AddInline(_ledeRun);
// create the hyperlink
_ledeCTALink = new Hyperlink()
{
//NavigateUri = (this.CTAUri) // can't do this because we need to catch the Click event ourselves
};
// create the text for the hyperlink
_ledeCTAText = new Run()
{
Text = this.CTAText.ToUpper()
};
StyleHelper.SetRunStyleFromStyle(_ledeCTAText, ctaStyle);
_ledeCTALink.Inlines.Add(_ledeCTAText);
_lede.AddInline(_ledeCTALink);
// add the click handler for the link
_ledeCTALink.Click += CTALink_Click;
}
else
{
// no CTA, so this is simple text; set lede binding
_lede.SetBinding(TextBlockEx.TextProperty,
new Binding()
{
Source = this, Path = new PropertyPath("Lede"), Mode = BindingMode.OneWay
});
}
// add to the grid
_layoutGrid.Children.Add(_lede);
}
}
private void RenderUI()
{
// get the layout base (a border here)
_layoutRoot = (Canvas)this.GetTemplateChild("LayoutRoot");
// if we can't get the layout root, we can't do anything
if (null == _layoutRoot)
{
return;
}
double batteryHeight = this.Width * .383;
double chargeHeight = batteryHeight - (2 * MARGIN_CHARGE_TOP);
double batteryHorizontalCenter = this.Width / 2;
double batteryVerticalCenter = batteryHeight / 2;
double TEXT_WIDTH = 100d;
double LEFT_HOURS = batteryHorizontalCenter - TEXT_WIDTH - (MARGIN_CHARGE_LEFT / 2);
double LEFT_HOURS_TEXT = batteryHorizontalCenter + (MARGIN_CHARGE_LEFT / 2);
double TOP_TEXT = batteryVerticalCenter - (chargeHeight / 2);
// set up the canvas
_layoutRoot.Width = this.Width;
_layoutRoot.Height = batteryHeight;
// create the battery
_imageBattery = new ImageEx()
{
Name = "Battery",
ImageSource = URI_IMAGE_BATTERY,
ImageWidth = this.Width
};
Canvas.SetLeft(_imageBattery, LEFT_BATTERY);
Canvas.SetTop(_imageBattery, TOP_BATTERY);
Canvas.SetZIndex(_imageBattery, Z_ORDER_BATTERY);
_layoutRoot.Children.Add(_imageBattery);
// create the charge
_imageCharge = new Image()
{
Name = "ChargeBar",
Source = new BitmapImage(new Uri(URI_IMAGE_CHARGE)),
Stretch = Stretch.Fill,
Width = CHARGE_START_WIDTH,
Height = chargeHeight
};
Canvas.SetLeft(_imageCharge, LEFT_CHARGE);
Canvas.SetTop(_imageCharge, TOP_CHARGE);
Canvas.SetZIndex(_imageCharge, Z_ORDER_CHARGE);
_layoutRoot.Children.Add(_imageCharge);
// create the percent overlay
_hours = new AnimatableInteger()
{
HourIntegerMax = this.HourIntegerMax,
Width = TEXT_WIDTH,
Height = chargeHeight,
VerticalAlignment = VerticalAlignment.Center,
DurationInMilliseconds = this.DurationInMilliseconds,
StaggerDelayInMilliseconds = this.StaggerDelayInMilliseconds
};
Canvas.SetLeft(_hours, LEFT_HOURS);
Canvas.SetTop(_hours, TOP_TEXT);
Canvas.SetZIndex(_hours, Z_ORDER_CONTROLS);
_layoutRoot.Children.Add(_hours);
double chargeEndWidth = this.Width - ((2 * MARGIN_CHARGE_LEFT) + CHARGE_START_WIDTH + 5);
// create the charge animation
_chargeStoryboard = SetupChargeAnimation(_imageCharge, CHARGE_START_WIDTH, chargeEndWidth, this.DurationInMilliseconds, this.StaggerDelayInMilliseconds);
// create hour text overlay
_hoursText = new TextBlockEx()
{
Text = this.HourText,
Width = TEXT_WIDTH,
Height = chargeHeight,
VerticalAlignment = VerticalAlignment.Center,
HorizontalAlignment = HorizontalAlignment.Left,
TextAlignment = TextAlignment.Left,
TextStyle = TextStyles.PopupBatteryLife
};
Canvas.SetLeft(_hoursText, LEFT_HOURS_TEXT);
Canvas.SetTop(_hoursText, TOP_TEXT);
Canvas.SetZIndex(_hoursText, Z_ORDER_CONTROLS);
_layoutRoot.Children.Add(_hoursText);
}
private void RenderUI()
{
// get the layoutroot
_layoutRoot = (Grid)this.GetTemplateChild("LayoutRoot");
if (null == _layoutRoot)
{
return;
}
// clear any children
_layoutRoot.Children.Clear();
// get ellipse size
double ellipseSize = StyleHelper.GetApplicationDouble(LayoutSizes.SwipeLeftEllipseRadius);
// set up grid
_layoutRoot.Width = WIDTH_CONTROL;
_layoutRoot.RowSpacing = StyleHelper.GetApplicationDouble(LayoutSizes.SwipeLeftSpacer);
_layoutRoot.RowDefinitions.Add(new RowDefinition()
{
Height = new GridLength(ellipseSize)
});
_layoutRoot.RowDefinitions.Add(new RowDefinition()
{
Height = new GridLength(1.0, GridUnitType.Auto)
});
_layoutRoot.ColumnDefinitions.Add(new ColumnDefinition()
{
Width = new GridLength(1.0, GridUnitType.Star)
});
// test
//TestHelper.AddGridCellBorders(_layoutRoot, 2, 1, Colors.DeepSkyBlue);
// create textblock
_textSwipe = new TextBlockEx()
{
Name = "SwipeText",
TextStyle = TextStyles.Swipe,
HorizontalAlignment = HorizontalAlignment.Center,
VerticalAlignment = VerticalAlignment.Center
};
_textSwipe.SetBinding(TextBlockEx.TextProperty,
new Binding()
{
Source = this, Path = new PropertyPath("SwipeText"), Mode = BindingMode.OneWay
});
Grid.SetRow(_textSwipe, 1);
Grid.SetColumn(_textSwipe, 0);
_layoutRoot.Children.Add(_textSwipe);
// create the ellipse
_ellipseSwipe = new Ellipse()
{
Width = ellipseSize,
Height = ellipseSize,
HorizontalAlignment = HorizontalAlignment.Right,
VerticalAlignment = VerticalAlignment.Center,
Stroke = new SolidColorBrush(Colors.White),
Fill = new SolidColorBrush(Colors.White),
Opacity = 0.0
};
Grid.SetRow(_ellipseSwipe, 0);
Grid.SetColumn(_ellipseSwipe, 0);
_layoutRoot.Children.Add(_ellipseSwipe);
// add a translate transform to the ellipse
_translateEllipse = new TranslateTransform()
{
X = 0
};
_ellipseSwipe.RenderTransform = _translateEllipse;
// set up control fades
_storyboardFadeIn = AnimationHelper.CreateEasingAnimation(_layoutRoot, "Opacity", 0.0, 0.0, 1.0, this.DurationInMilliseconds, this.StaggerDelayInMilliseconds + ANIM_STAGGER_TEXT_FADEIN, false, false, new RepeatBehavior(1));
_storyboardFadeOut = AnimationHelper.CreateEasingAnimation(_layoutRoot, "Opacity", 0.0, 1.0, 0.0, this.DurationInMilliseconds, this.StaggerDelayInMilliseconds + ANIM_STAGGER_TEXT_FADEOUT, false, false, new RepeatBehavior(1));
// set up ellipse fades
_storyboardEllipseFadeIn = AnimationHelper.CreateEasingAnimationWithNotify(_ellipseSwipe, this.FadeIn_Complete, "Opacity", 0.0, 0.0, 1.0, null, null, ANIM_DURATION_ELLIPSE_FADE, this.StaggerDelayInMilliseconds + ANIM_STAGGER_ELLIPSE_FADEIN, false, false, new RepeatBehavior(1));
_storyboardEllipseFadeOut = AnimationHelper.CreateEasingAnimation(_ellipseSwipe, "Opacity", 0.0, 1.0, 0.0, ANIM_DURATION_ELLIPSE_FADE, 0d, false, false, new RepeatBehavior(1));
// fade out original stagger: this.StaggerDelayInMilliseconds + ANIM_STAGGER_ELLIPSE_FADEOUT
QuinticEase quinticEase = new QuinticEase()
{
EasingMode = EasingMode.EaseInOut
};
// set up ellipse move
_storyboardEllipseMove = AnimationHelper.CreateEasingAnimationWithNotify(_ellipseSwipe, this.Move_Complete, "(Ellipse.RenderTransform).(TranslateTransform.X)", 0.0, 0.0, -1 * WIDTH_CONTROL + ellipseSize, quinticEase, quinticEase, ANIM_DURATION_ELLIPSE_MOVE, 0d, false, false, new RepeatBehavior(1));
// move original stagger: this.StaggerDelayInMilliseconds + ANIM_STAGGER_ELLIPSE_MOVE
}
