Change the size of coding4fun RoundButton - xaml

I'm trying to change the size of the coding4fun RoundButton I realised that the width and height properties does not work.
<c4f:RoundButton
ImageSource="/Assets/AppBar/play.png"
Width="150"
Height="150"/>
The documentation is short and has not been updated lately (ImagePath is now called ImageSource).
If it is possible to change the size of the image inside the RoundButton then I can work with that as well. How do? Maybe creating my own round button is the solution?

Use ButtonHeight and ButtonWidth properties
<c4f:RoundButton ButtonWidth="300" ButtonHeight="300" />

Related

How animate margin in UWP?

I'm try use
<animations:AnimationCollection x:Name="UnHoverCollection">
<animations:Vector2Animation To="10,10" Target="Margin" />
</animations:AnimationCollection>
and this animations
<animations:AnimationCollection x:Name="UnHoverCollection">
<animations:Vector4Animation To="10,10,10,10" Target="Margin" />
</animations:AnimationCollection>
and take next error
"The specified property was not found or cannot be animated. Context:
Margin Expression: Margin Start Position: 0, End Position: 6"
How do this animation?
If you want to move the object, animating the margin is not a good idea. These animation types are mainly operated according to X, Y coordinate. I suggest that you can use TranslationAnimation or OffsetAnimations. You can refer to this document to move the object.

Appcelerator: How to create Ti.UI.TextArea dynamically adjusting to content but with minimal height

I want to create a Ti.UI.TextArea object which would dynamically adjust its height to content but would have default height set (if no content). In Appcelerator if you don't specify height then it will automatically adjust its size to content but if there is no text then its size will be similar to textField. This is to small for me.
If you specify height property, then TextArea height won't change even if text will be longer than editable region.
I would like to have something like this:
var textArea = Ti.UI.createTextArea({
minHeight: 30,
});
or like this:
var textArea = Ti.UI.createTextArea({
minLines: 3,
});
I am looking for solution both for Android and iOS.
Is there any workaround for that?
You can change the height of the textField dynamically.
Add onChange event handler and change the height of the textField dynamically according to the number of lines in the text field.
Starting with 7.5.0.GA you can use maxLines on Android to be able to extend the TextArea to when pressing return. For iOS you have to create a work-around since there is no parity at the moment.

Image translation is clipped (how to prevent)

How can I force a UI object to NOT be clipped when it's partly outside the screen. I have an image that doesn't fit inside the screen completely. When I drag it (TranslateY) it moves like it's supposed to but the problem is that the part that was outside the screen doesn't appear so the image is abruptly cut. The only part of the image that is visibly moving is the part that originally fit to the screen.
Ps. Please do not recommend scollviewer as this is about a gesture to do a specific thing on the UI and ScrollViewer is not ok for that.
This is basically the XAML (The image is twice the height of the display)
<Grid x:Name="GestureScreen" ManipulationMode="TranslateY" RenderTransformOrigin="0.5,0.5">
<Image x:Name="GestureImage" CacheMode="BitMapCache" Source="Assets/bg/draggable.png" />
</Grid>
This is the C# (not really relevant, but still)
void GestureScreen_ManipulationDelta(object sender, ManipulationDeltaRoutedEventArgs e)
{
move.Y += e.Delta.Translation.Y;
}
Specify a row and column for the image which directly specifies Auto for both. That way the image will size to its actual size and not the current size of the * defaults of the screen size. Hence you will have the whole image as dragged.

Horizontal scrollbar when a Rally cardboard is used inside an Ext Tab

I have a Rally.ui.cardboard.CardBoard as an item in an Ext.tab.Panel. When there are enough cards to cause a vertical scrollbar to appear, eating 16px of width, instead of fitting the new width dynamically, a horizontal scrollbar appears too. This doesn't happen when the CardBoard is rendered to document.body.
I've been looking for the right set of config options to make the TabPanel and its child items[] resize automatically. After two days trying in vain, I'm about to give up and just force a width of 1902px for PCs and 2862px for Macs. If anyone has a better idea, I'm more than willing to try it... anything at this point.
We could find no way to do this through config options alone, so we ended up listening to the App's own resize event and updated the panel size. In the App config we have this, and it does the trick:
listeners: {
resize: function( app, width, height, oldWidth, oldHeight, eOpts ) {
if (app.TabPanel) {
app.TabPanel.setWidth(window.innerWidth);
app.TabPanel.setHeight(window.innerHeight);
}
}
}
If anyone has a better solution that only uses config options and the framework does the resizing, I'd still like to see it, as the above is an ugly hack even if it works.

XAML: accessing actual width and height

I have a viewbox with an image inside:
<Viewbox MaxHeight="100" MaxWidth="100" x:Name="Scenario4ImageContainer2" Stretch="Uniform" Grid.Column="1" Grid.Row="1">
<Image x:Name="Scenario4Image" PointerPressed="Scenario4Image_PointerPressed" HorizontalAlignment="Stretch" />
</Viewbox>
I want to be able to grab the actual width/height values, but when I try this in the backend C#:
int w = (int)Scenario4ImageContainer.Width
I get an error saying the parameter is incorrect.
This goes away if I hardcode the width, but I want it to resize dynamically.
I also tried grabbing Scenario4ImageContainer.ActualWidth but this parameter was "incorrect" as well.
A while back I was trying to measure width of a string. You can try a similar mechanism to get dimensions.
http://invokeit.wordpress.com/2012/09/19/how-to-measure-rendered-string-dimensions-in-win8dev/
this.tb.FontSize = 20;
this.tb.Measire(new Size(400, 300)); // assuming that 400x300 is max size of textblock you want
double currentWidth = this.tb.DesiredSize.Width;
double currentHeight = this.tb.DesiredSize.Height;
Seems like I've found the event you need to handle: you should handle ImageOpened event. It is because image is retrieved asynchronously and if try to handle any other event there is a good chance to not have image loaded at that time so actual size is zero
On every draw I do a quick check to see if the container size has changed (with an initialization of 0 at the beginning to make sure it catches the first time).
if (containerWidth != Output.ActualWidth - 300)
{
Scenario4ImageContainer.Width = Output.ActualWidth - 300;
Scenario4ImageContainer.Height = Output.ActualHeight - 20;
containerWidth = Output.ActualWidth - 300;
}
It works for the most part, but when the class gets navigated out and navigated back it has a problem for some reason. Probably unrelated.