0

What I'm trying to do is have a background image that will have to be scrolled down to see the whole background image. On top of that background, will be an absolute layout with buttons in random places. If you look at the background concept image I uploaded the black circles represent buttons and the darker bottom half would be a part not visible until the user scrolls down.

I've tried Minimum height requests and similar methods but it always seems to just squish the background image rather than fit the scroll view.

Thanks, here's the .xaml file and .cs file

<?xml version="1.0" encoding="utf-8" ?>
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
         xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
         x:Class="Lessons.MenuPage">

<ContentPage.Content>

<ScrollView HorizontalOptions="FillAndExpand">

        <AbsoluteLayout HorizontalOptions="FillAndExpand">
            <Image HorizontalOptions="FillAndExpand" Aspect="AspectFill" Source="@drawable/matt_root"/>

        <Button WidthRequest="40" HeightRequest="40" BackgroundColor="White"
                Text="1" TextColor="Black" AbsoluteLayout.LayoutBounds="25,410"/>
        <Button WidthRequest="40" HeightRequest="40" BackgroundColor="White"
                Text="2" TextColor="Black" AbsoluteLayout.LayoutBounds="65,460"/>
        <Button WidthRequest="40" HeightRequest="40" BackgroundColor="White"
                Text="3" TextColor="Black" AbsoluteLayout.LayoutBounds="125,535"/>
    </AbsoluteLayout>
</ScrollView>
</ContentPage.Content>


using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks;

using Xamarin.Forms;
using Xamarin.Forms.Xaml;

namespace Lessons
{
[XamlCompilation(XamlCompilationOptions.Compile)]
public partial class MenuPage: ContentPage
{
    public ProfilePage ()
    {
        InitializeComponent ();

    }
}
}

not filling the width

Matthew C
  • 21
  • 2
  • I got the background to scroll by setting it as an image in the absolute layout and the buttons do in fact go on top of the image which is nice. but now I can't get the image to fill the width I've tried aspect fill etc. but none will fill the width of the screen – Matthew C Oct 09 '18 at 23:43
  • if you have changed code , your question would change. " now I can't get the image to fill the width I've tried aspect fill " is it not occupying whole width? – Morse Oct 09 '18 at 23:51
  • @Prateek yes, give me a second I'll update my question with a new image – Matthew C Oct 10 '18 at 00:02
  • @Prateek I've tried every combination of Horizontal options and aspect. The only one that seemed to make a difference was the width request but when I did it just cuts off a large chunk off of the top. – Matthew C Oct 10 '18 at 00:09
  • I think you can use FFLoading nuget, they seem to have good image manipulation. I suggest you to go through this [article](https://dzone.com/articles/using-full-size-none-stretched) . Also did you try `Aspect="Fill"` on image? if the image is not proportional i think its not possible – Morse Oct 10 '18 at 00:12
  • @Prateek Not sure if a relative layout will work, I need buttons in a custom places. Is that possible? Although I may have found a solution. In the CS code i take the name of my image and say myImage.WidthRequest = Application.Current.MainPage.Width; Thanks for your help, I appreciate your time!! – Matthew C Oct 10 '18 at 00:44

0 Answers0