Arbeide med Image Control: Veiledning for Windows Phone Apps Development - Del 18

Arbeide med Image Control: Veiledning for Windows Phone Apps Development - Del 18
Arbeide med Image Control: Veiledning for Windows Phone Apps Development - Del 18

Video: Arbeide med Image Control: Veiledning for Windows Phone Apps Development - Del 18

Video: Arbeide med Image Control: Veiledning for Windows Phone Apps Development - Del 18
Video: USB Devices Not Working Windows 10 DELL (Official Dell Tech Support) - YouTube 2024, April
Anonim

Nå som vi leier om XAML Event and Input Controls, i denne arten av Windows Phone 7.5 Mango App-utviklingsserien, skal vi se på Image Control som lar deg vise bilder i Silverlight Windows Phone 7-programmet.

Så la oss komme i gang!

Opprett et nytt Windows Phone 7-prosjekt med et unikt navn som "ImageControlDemo". Dra og slipp Bildekontrollen fra verktøykassen til designflaten. Nå for å vise et bilde i bildekontrollen bruker vi "Source" -egenskapen til Image Control. Denne egenskapen finnes i Egenskaper-vinduet like før 'Stretch'-egenskapen. Kildeegenskapen definerer hvor bildet kommer fra, for å bli vist i Image Control. Når du klikker på ellipsen ved siden av egenskapen Source, åpnes et nytt vindu som ber oss om å velge bildet. Klikk på Legg til bilde-knappen for å legge til et bilde i prosjektet.

Ved å velge et bilde skjer et par interessante ting. Først av alt oppretter Visual Studio automatisk en mappe ved navn Bilder og legger til bildefilen du valgte. For det andre oppretter den en URI (Uniform Resource Identifier) / bane for å få tilgang til bildet, noe som '/Images;component/Images/Picture1.jpg'. / Bildet refererer til distribusjonspakken, og hva som kommer etter at semikolonet vil referere den filen i distribusjonspakken når den er distribuert på telefonen, det vil si xap-filen. Når du har klikket på OK-knappen i vinduet Velg bilde, lastes bildet inn i bildekontrollen.

En annen merkbar egenskap for bildekontrollen er egenskapen 'Stretch'. Setter Stretch-egenskapen til Fyll; fyller hele området av bildekontrollen med bildet uavhengig av bildens dimensjoner. Endring av størrelsen på bildekontrollen endrer størrelsen på bildet. Ingen hensyn til andelen av bildet er gitt, slik at bildet forvrenges. Hvis du stiller Stretch-egenskapen til Uniform, holder perspektivet riktig ved å hedre høyden eller bredden på bildet, men det vil ikke beskjære bildet. Innstilling av Stretch-egenskapen til 'UniformToFill' ærer bildets vertikale og horisontale proporsjoner. Bildet klippes om nødvendig for å opprettholde proporsjonen. Klippen kan adresseres ved å la brukeren bla gjennom bildet opp eller ned, til venstre eller høyre. For å gjøre dette er alt du trenger å gjøre, omgir bildet med en ScrollViewer-kontroll og sett den synlige for horisontal og vertikal rullbarhet.
En annen merkbar egenskap for bildekontrollen er egenskapen 'Stretch'. Setter Stretch-egenskapen til Fyll; fyller hele området av bildekontrollen med bildet uavhengig av bildens dimensjoner. Endring av størrelsen på bildekontrollen endrer størrelsen på bildet. Ingen hensyn til andelen av bildet er gitt, slik at bildet forvrenges. Hvis du stiller Stretch-egenskapen til Uniform, holder perspektivet riktig ved å hedre høyden eller bredden på bildet, men det vil ikke beskjære bildet. Innstilling av Stretch-egenskapen til 'UniformToFill' ærer bildets vertikale og horisontale proporsjoner. Bildet klippes om nødvendig for å opprettholde proporsjonen. Klippen kan adresseres ved å la brukeren bla gjennom bildet opp eller ned, til venstre eller høyre. For å gjøre dette er alt du trenger å gjøre, omgir bildet med en ScrollViewer-kontroll og sett den synlige for horisontal og vertikal rullbarhet.
Image Control Uniform Property
Image Control Uniform Property

En siste ting før vi avslutter denne leksjonen. Hvis du ønsker å sette bildet gjennom C # -koden alt du trenger å gjøre, er å opprette et objekt med BitmapImage-objekt og angi URI i den overbelastede konstruktøren. Når BitmapImage-objektet er opprettet, er alt du trenger å gjøre, likestill det til kildeegenskapen til Image Control.

BitmapImage myImage = ny BitmapImage (ny Uri ("/ Images; component / Images / Penguins.jpg", UriKind.Relative));

image1.Source = myImage;

Det er ganske enkelt kontroll og har sin brukervennlighet på mange steder.

Det er det for nå, i neste opplæring vil vi lære mer om stiler og ressurser.

Relaterte innlegg:

  • GPS, Location API og Calling Web Services: Windows Phone Apps Development Tutorial - 25
  • Lær å utvikle Windows Phone 7.5 Mango-applikasjoner: Del 1
  • Windows Phone Tutorial 8: Opprette en egendefinert knapp i Expression Blend-I
  • Windows Phone Tutorial 4: Designe brukergrensesnittet
  • Arbeide med stiler og ressurser: Veiledning for utvikling av Windows Phone Apps Development - Del 19

Anbefalt: