I am trying to show an Activity Indicator in my App for which I have written the following code but the indicator is not getting rendered on the screen.
Can somebody please suggest what has gone wrong?
private ActivityIndicator indicator = new ActivityIndicator
{
HorizontalOptions = LayoutOptions.CenterAndExpand,
Color = Color.Black,
IsVisible = false
};
StackLayout stack = new StackLayout
{
VerticalOptions=LayoutOptions.FillAndExpand,
HorizontalOptions=LayoutOptions.FillAndExpand,
Padding=0,
Spacing=0,
};
AbsoluteLayout absolute = new AbsoluteLayout
{
VerticalOptions = LayoutOptions.FillAndExpand,
HorizontalOptions = LayoutOptions.FillAndExpand,
};
stack.Children.Add(map);
stack.Children.Add(browser);
AbsoluteLayout.SetLayoutFlags(stack, AbsoluteLayoutFlags.PositionProportional);
AbsoluteLayout.SetLayoutBounds(stack, new Rectangle(0f, 0f, AbsoluteLayout.AutoSize, AbsoluteLayout.AutoSize));
AbsoluteLayout.SetLayoutFlags(indicator, AbsoluteLayoutFlags.PositionProportional);
AbsoluteLayout.SetLayoutBounds(indicator, new Rectangle(0.5f, 0.5f, AbsoluteLayout.AutoSize, AbsoluteLayout.AutoSize));
absolute.Children.Add(indicator);
absolute.Children.Add(stack);
*//When Some activity occurs.....Indicator is shown like this*
indicator.SetBinding(ActivityIndicator.IsVisibleProperty, "IsBusy", BindingMode.OneWay);
indicator.SetBinding(ActivityIndicator.IsRunningProperty, "IsBusy", BindingMode.OneWay);
indicator.IsRunning = true;
indicator.IsVisible = true;
Try this
AbsoluteLayout.SetLayoutBounds(stack, new Rectangle(0f, 0f, 1f, 1f));
AbsoluteLayout.SetLayoutBounds(indicator, new Rectangle(0.5f, 0.5f, -1f, -1f));
AbsoluteLayout.SetLayoutFlags(stack, AbsoluteLayoutFlags.All);
Add the indicator after the stack. absolute.Children.Add(indicator) after absolute.Children.Add(stack);
Check If your IsVisible is true.
Related
Xamarin.Forms on Android. I have scrollView with stack inside. Scroll works, but scrollBar not visible. I've tried to write custom renders but it didn't help.
My code: https://github.com/FeduniakVitalii/ScrollView
var contentAndWebViewLayout = new StackLayout() { Orientation = StackOrientation.Vertical, VerticalOptions = LayoutOptions.FillAndExpand};
contentAndWebViewLayout.Children.Add(contentLayout);
contentAndWebViewLayout.Children.Add(webView);
ScrollView scrollView = new ScrollView()
{
Content = contentAndWebViewLayout,
IsEnabled = true,
IsVerticalScrollbarEnabled = true,
IsClippedToBounds = true,
VerticalScrollBarVisibility = ScrollBarVisibility.Always,
VerticalOptions = LayoutOptions.FillAndExpand,
};
var converter = new HtmlLabelConverter();
var layout = new RelativeLayout()
{
BackgroundColor = Color.White,
VerticalOptions = LayoutOptions.FillAndExpand
};
layout.Children.Add(scrollView,
xConstraint: Constraint.Constant(0),
yConstraint: Constraint.Constant(0),
widthConstraint: Constraint.RelativeToParent((parent) => { return parent.Width; }),
heightConstraint: Constraint.RelativeToParent((parent) => { return parent.Height; }));
this.Content = layout;
I tried to downgrade Xamarin.Forms version to 3.4, problem solved !
My CreateRegisterView function returns the result I expect
Last lines of my function
var content = new StackLayout
{
Margin = 0,
Padding = 0,
BackgroundColor = Color.Gold
};
content.Children.Add(forms);
content.Children.Add(new BoxView
{
Margin = 0,
Color = Color.Red,
VerticalOptions = LayoutOptions.FillAndExpand
});
AbsoluteLayout.SetLayoutFlags(content, AbsoluteLayoutFlags.PositionProportional);
AbsoluteLayout.SetLayoutBounds(content, new Rectangle(0f, 0f, AbsoluteLayout.AutoSize, AbsoluteLayout.AutoSize));
AbsoluteLayout.SetLayoutFlags(_ActivityIndicator, AbsoluteLayoutFlags.PositionProportional);
AbsoluteLayout.SetLayoutBounds(_ActivityIndicator, new Rectangle(0.5, 0.5, AbsoluteLayout.AutoSize, AbsoluteLayout.AutoSize));
var overlay = new AbsoluteLayout();
overlay.Children.Add(content);
overlay.Children.Add(_ActivityIndicator);
return overlay;
But as soon as I add an activity indicator I have this result
I didn't see any definition of _ActivityIndicator. The only explanation for what you're facing would that _ActivityIndicatorrefers to the same instance of content in some code You've omitted.
If it's not the case, try changing your bounds getting rid of the AutoSize to the content view.
Like this:
AbsoluteLayout.SetLayoutBounds(content, new Rectangle(0f, 0f, 1f, 1f));
AbsoluteLayout.SetLayoutFlags(content, AbsoluteLayoutFlags.All);
AbsoluteLayout.SetLayoutBounds(_ActivityIndicator, new Rectangle(0.5, 0.5, AbsoluteLayout.AutoSize, AbsoluteLayout.AutoSize));
AbsoluteLayout.SetLayoutFlags(_ActivityIndicator, AbsoluteLayoutFlags.PositionProportional);
I have a StackLayout holding some elements for a custom cell in a ListView. The problem I am running in to is that my images are not landing on full pixel boundaries. This is causing the straight lines in my graphics to become blurry as they are not landing on pixel boundaries. Is there a way for me to easily prevent this behavior, perhaps in a custom renderer?
public InputEditCell()
{
image = new Image { HorizontalOptions = LayoutOptions.Start };
image.SetBinding(Image.SourceProperty, new Binding("Image.ImageNameSelect"));
image.BindingContext = _tempInputViewModel;
var tappedImageGesture = new TapGestureRecognizer
{
Command = new Command(OnImageTapped),
CommandParameter = image
};
image.GestureRecognizers.Add(tappedImageGesture);
nameEntry = new Entry()
{
TextColor = Color.FromHex("E60006"),
FontSize = Device.GetNamedSize(NamedSize.Medium, typeof(Entry)),
VerticalOptions = LayoutOptions.Center,
HorizontalOptions = LayoutOptions.FillAndExpand
};
nameEntry.SetBinding(Entry.TextProperty, "Name");
nameEntry.BindingContext = _tempInputViewModel;
var acceptImage = new Image
{
Source = ResourceHandler.GetAcceptImage(),
VerticalOptions = LayoutOptions.Center,
HorizontalOptions = LayoutOptions.End,
};
var tappedAcceptGesture = new TapGestureRecognizer
{
Command = new Command(OnAcceptTapped),
CommandParameter = acceptImage
};
acceptImage.GestureRecognizers.Add(tappedAcceptGesture);
var cancelImage = new Image
{
Source = ResourceHandler.GetCancelImage(),
VerticalOptions = LayoutOptions.Center,
HorizontalOptions = LayoutOptions.End,
};
var tappedCancelGesture = new TapGestureRecognizer
{
Command = new Command(OnCancelTapped),
CommandParameter = cancelImage
};
cancelImage.GestureRecognizers.Add(tappedCancelGesture);
var viewLayout = new StackLayout {
Orientation = StackOrientation.Horizontal,
Children = { image, nameEntry, acceptImage, cancelImage },
Padding = new Thickness(10, 10, 10 ,10)
};
View = viewLayout;
View.GestureRecognizers.Clear();
View.GestureRecognizers.Add(new TapGestureRecognizer());
}
The layout i want is like this: http://imgur.com/etb9ZKZ
I want the image (illustrated with the color green) to fill the entire layoutcontol. On top of image positioned at the bottom with full width i want a textbox/label to put a title. The title view should have a black semi-transparent background.
This is the best i've got (the code below), but it has a few issues:
#1 - The text doesnt wrap like it is suppose to. It just cuts the sentence, like the rest is going off screen.
#2 - The image doesnt scale to the width of the container.
Label lblTitle = new Label()
{
BackgroundColor = new Color(0, 0, 0, 0.8),
LineBreakMode = LineBreakMode.WordWrap,
FontSize = Device.GetNamedSize(NamedSize.Large, typeof(Label))
};
lblTitle.SetBinding(Label.TextProperty, "headline");
Image imgBanner = new Image()
{
/*
HorizontalOptions = LayoutOptions.Fill,
VerticalOptions = LayoutOptions.End,
Aspect = Aspect.Fill
*/
};
imgBanner.SetBinding(Image.SourceProperty, "ImageUrlSource");
AbsoluteLayout.SetLayoutFlags(lblTitle, AbsoluteLayoutFlags.PositionProportional | AbsoluteLayoutFlags.WidthProportional);
AbsoluteLayout.SetLayoutBounds(lblTitle, new Rectangle(0, 1, 1, AbsoluteLayout.AutoSize));
AbsoluteLayout.SetLayoutFlags(imgBanner, AbsoluteLayoutFlags.SizeProportional);
AbsoluteLayout.SetLayoutBounds(imgBanner, new Rectangle(0, 0, 1, 1));
AbsoluteLayout layout = new AbsoluteLayout()
{
HorizontalOptions = LayoutOptions.Fill,
Children =
{
imgBanner,
lblTitle
}
};
View = layout;
You should use Grid instead.
Label lblTitle = new Label()
{
BackgroundColor = new Color(0, 0, 0, 0.8),
LineBreakMode = LineBreakMode.WordWrap,
FontSize = Device.GetNamedSize(NamedSize.Large, typeof(Label))
};
lblTitle.SetBinding(Label.TextProperty, "headline");
Image imgBanner = new Image()
{
/*
HorizontalOptions = LayoutOptions.Fill,
VerticalOptions = LayoutOptions.End,
Aspect = Aspect.Fill
*/
};
imgBanner.SetBinding(Image.SourceProperty, "ImageUrlSource");
//=========== Addition Start Here ============//
Grid grid = new Grid();
grid.RowDefinitions =
{
new RowDefinition{ Height=new GridLength(200,GridUnitType.Absolute) },
new RowDefinition{ Height=new GridLength(30,GridUnitType.Absolute},
}
grid.Children.Add(imgBanner,0,1,0,2); //two rowspan
// == .Add(imgBanner,column,column+columnspan,row,row+rowspan)
grid.Children.Add(lblTitle,0,1,1,2); //one rowspan
View = grid;
I have a StackLayout coded like this:
StackLayout mainStackLayOut = new StackLayout{
BackgroundColor = Color.Blue,
//VerticalOptions = LayoutOptions.FillAndExpand,
//WidthRequest = width,
HorizontalOptions = LayoutOptions.FillAndExpand,
Orientation = StackOrientation.Vertical
};
But I want the StackLayout to fill all the screen width and height, also I have tree buttons added like this:
StackLayout buttonsStackLayOut = new StackLayout
{
BackgroundColor = Color.White,
//VerticalOptions = LayoutOptions.Fill,
HorizontalOptions = LayoutOptions.Fill,
Orientation = StackOrientation.Horizontal,
Spacing = 0
};
mainStackLayOut.Children.Add(buttonsStackLayOut);
Image doctorImage = new Image
{
WidthRequest = width / 3,
HeightRequest = 50,
BackgroundColor = Color.Gray,
Source = ImageSource.FromFile ("about.png")
};
buttonsStackLayOut.Children.Add(doctorImage);
How can I fill all the screensize?
In the most simple form I have managed to achieve what you require.
I set the content of the screen to the main stack layout.
var mainStackLayout = new StackLayout { BackgroundColor = Color.Blue};
var buttonsStackLayout = new StackLayout { BackgroundColor = Color.White, Orientation = StackOrientation.Horizontal , Spacing = 0 };
Image about = new Image { HeightRequest = 50, Source = ImageSource.FromFile("about.jpg") };
Image twitter = new Image { HeightRequest = 50, Source = ImageSource.FromFile("twitter.jpg") };
Image refresh = new Image { HeightRequest = 50, Source = ImageSource.FromFile("refresh.jpg") };
buttonsStackLayout.Children.Add(about);
buttonsStackLayout.Children.Add(twitter);
buttonsStackLayout.Children.Add(refresh);
mainStackLayout.Children.Add(buttonsStackLayout);
this.Content = mainStackLayout;