2016-12-16 78 views
0

我有这段代码来创建我的页面,但由于某种原因,图像操作系统采取整个页面,并没有显示任何其他内容 这里是我所得到的图片。尽管stacklayout内图像超车整个屏幕?

http://imgur.com/a/3qB9F

namespace GarageSale.Views 
{ 
public class abcChapterPage : basePage 
{ 
myDataTypes.abcChapter abc; 

StackLayout baseStack; 

#region Views 
Label lblName = new Label 
{ 
    Text = "", 
    VerticalOptions = LayoutOptions.StartAndExpand, 
    HorizontalOptions = LayoutOptions.CenterAndExpand 
}; 

Label lblSchool = new Label 
{ 
    Text = "", 
    VerticalOptions = LayoutOptions.StartAndExpand, 
    HorizontalOptions = LayoutOptions.CenterAndExpand 
}; 

Label lblLocation = new Label 
{ 
    Text = "", 
    VerticalOptions = LayoutOptions.CenterAndExpand, 
    HorizontalOptions = LayoutOptions.CenterAndExpand 
}; 

Image profImg = new Image 
{ 
    Scale = .1f, 
    Aspect = Aspect.AspectFit, 

}; 

Button viewItems = new Button 
{ 
    Text = " View Items ", 
    BorderRadius = 0, 
    //Margin = 0, 
    HorizontalOptions = LayoutOptions.FillAndExpand, 
}; 

Button viewMembers = new Button 
{ 
    Text = "View Members", 
    BorderRadius = 0, 
    //Margin = 0, 
    HorizontalOptions = LayoutOptions.FillAndExpand, 
}; 

#endregion 

public abcChapterPage(myDataTypes.abcChapter o) 
{ 
    abc = o; 

    populateProfileFields(); 

} 

public abcChapterPage() 
{ 
    shouldGetChapter = true; 
    abcid = int.Parse(App.CredManager.GetAccountValue("abc_chapter_id")); 
} 

StackLayout makeGUI() 
{ 
    viewItems.Command = new Command(() => 
    { 
     Navigation.PushAsync(new viewListPage(new itemListView(), abc.id, 1, "Items for sale by " + abc.school)); 
    }); 

    viewMembers.Command = new Command(() => 
    { 
     Navigation.PushAsync(new viewListPage(new userListView(), abc.id, 2, " abc Members " + abc.school)); 
    }); 



    #region basestack 
    return new StackLayout 
    { 
     VerticalOptions = LayoutOptions.Fill, 
     HorizontalOptions = LayoutOptions.Fill, 
     Children = { 
      //lblName, 
      profImg, 
      lblSchool, 
      lblLocation, 
      new StackLayout { 
       Orientation = StackOrientation.Horizontal, 
       Padding = 0, 
       // Margin = 0, 
       Spacing = 0, 
       Children = { 
        viewItems, 
        viewMembers 
       } 
      } 
     } 
    }; 
    #endregion 

} 

public void populateProfileFields() 
{ 
    baseStack = makeGUI(); 
    Title = abc.school + " abc"; 
    lblSchool.Text = abc.school; 
    lblLocation.Text = abc.city +", "+ abc.state; 

    profImg.Source = ImageSource.FromStream(() => new MemoryStream(abc.picture)); 

    Content = baseStack; 
    //TODO: do this if user is admin 
    //if (Constants.AdminUsers.Contains(App.CredManager.GetAccountValue("G_id")) && !adminAlert) 
    //{ 
    // await Task.Delay(5000); 
    // DisplayAlert("Admin Notice:", "You are logged in as an administrative user!", "Dismiss"); 
    // adminAlert = true; 
    //} 

} 

bool shouldGetChapter = false; 
int abcid; 

protected async override void OnAppearing() 
{ 
    if (shouldGetChapter) 
    { 
     abc = await App.MANAGER.YSSI.GetabcChapter(abcid); 
     populateProfileFields(); 
    } 
} 

}

+0

使用xaml并使xaml预览工具可用 – BraveHeart

回答

0

图像是由于默认的文本颜色为黑色像背景颜色的不可见的图像上的所有其它内容的顶部铺设。 图像中心的原因可能是你应该删除它的Scale = .1f,

0

您可能会误解Xamarin.Forms中Aspect的使用,Image控件可以在不保留宽高比的情况下填充容器,剪切图像或对其进行封箱处理。它不会自行调整大小,图像保持其宽高比。

就你而言,你的图像容器是整个StackLayout,所以图像覆盖了其他控件。如果要调整图像大小,除了更改图像源本身外,还有很多方法,这里最简单的方法应该是将固定大小设置为图像控件,但是如果要为大多数不同大小创建适应版式的设备,在这种情况下,我建议把Xamarin.Forms.Grid,并为其设置RowDefinitionsColumnDefinitions