Часть 1. Быстрый старт на Xamarin.Forms

👁 47 просмотров

Первая часть будет демонстрировать, как создать приложение, которое будет преобразовать буквенно-цифровой номер, введенный пользователем в числовой номер телефона и затем вызывать этот номер.

Пример итогового приложения
Пример итогового приложения

 

И так, условимся, что мы начинаем новый проект в  Visual Studio с Xamarin.Forms под названием Phoneword:

1). Сначала запускаем Visual Studio. На картинке начальное окно программы:

Начальное окно программы Visual Studio
Начальное окно программы Visual Studio

 

2). В Visual Studio нажимаем на кнопку Create new project… :

Нажимаем на кнопку создания нового проекта
Нажимаем на кнопку создания нового проекта

 

3). В диалоге New Project, жмем Cross-Platform, выбираем шаблон Mobile App (Xamarin.Forms), задаем имя Phoneword, выбираем расположение проекта и жмем кнопку OK:

Диалог создания проекта
Диалог создания проекта

 

4). В диалоге New Cross Platform App, нажимаем Blank App, выбираем .NET Standard как Code Sharing Strategy, и жмем кнопку OK:

Диалог выбора платформ и стратегии развития проекта
Диалог выбора платформ и стратегии развития проекта

 

5). В разделе Solution Explorer, проекта Phoneword, делаем двойной щелчок на MainPage.xaml для открытия этого файла в редакторе:

Открытый файл MainPage.xaml в редакторе
Открытый файл MainPage.xaml в редакторе

 

6). В MainPage.xaml, удаляем весь код шаблона и заменяем кодом, который ниже. Этот код декларативно определяет интерфейс пользователя для страницы:

<?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="Phoneword.MainPage">
    <ContentPage.Padding>
        <OnPlatform x:TypeArguments="Thickness">
            <On Platform="iOS" Value="20, 40, 20, 20" />
            <On Platform="Android, UWP" Value="20" />
        </OnPlatform>
    </ContentPage.Padding>
    <StackLayout>
      <Label Text="Enter a Phoneword:" />
      <Entry x:Name="phoneNumberText" Text="1-855-XAMARIN" />
      <Button Text="Translate" Clicked="OnTranslate" />
      <Button x:Name="callButton" Text="Call" IsEnabled="false" Clicked="OnCall" />
    </StackLayout>
</ContentPage>

Сохраняем изменения в MainPage.xaml , нажав комбинацию CTRL+S, и закрываем файл.

7). В разделе Solution Explorer, распускаем MainPage.xaml и двойным щелчком открываем файл кода страницы MainPage.xaml.cs:

Файл кода страницы MainPage.xaml.cs
Файл кода страницы MainPage.xaml.cs

 

8). В коде MainPage.xaml.cs, удаляем весь код шаблона и заменяем его на следующий код. Методы OnTranslate и OnCall должны быть выполнены в ответ на нажатие кнопок Translate и Call со стороны пользовательского интерфейса соответственно:

using System;
using Xamarin.Forms;

namespace Phoneword
{
    public partial class MainPage : ContentPage
    {
        string translatedNumber;

        public MainPage ()
        {
            InitializeComponent ();
        }

        void OnTranslate (object sender, EventArgs e)
        {
            translatedNumber = PhonewordTranslator.ToNumber (phoneNumberText.Text);
            if (!string.IsNullOrWhiteSpace (translatedNumber)) {
                callButton.IsEnabled = true;
                callButton.Text = "Call " + translatedNumber;
            } else {
                callButton.IsEnabled = false;
                callButton.Text = "Call";
            }
        }

        async void OnCall (object sender, EventArgs e)
        {
            if (await this.DisplayAlert (
                    "Dial a Number",
                    "Would you like to call " + translatedNumber + "?",
                    "Yes",
                    "No")) {
                var dialer = DependencyService.Get<IDialer> ();
                if (dialer != null)
                    dialer.Dial (translatedNumber);
            }
        }
    }
}

 

Замечание. Теперь можно попробовать построить приложение и мы увидим сообщения об ошибках, которые мы исправим далее.

Сохраняем изменения в файле MainPage.xaml.cs нажатием комбинации CTRL+S, закрываем файл.

9). В Solution Explorer, кликаем правую кнопку мыши на проект Phoneword и выбираем Add > New Item…:

Добавляем новый элемент в проект
Добавляем новый элемент в проект

10). В диалоге Add New Item выбираем Visual C# > Code > Class, вводим название PhoneTranslator, и жмем кнопку Add:

Диалог добавления нового класса
Диалог добавления нового класса

 

11). В файле PhoneTranslator.cs, удаляем весь шаблон кода и заменяем на ниже указанный. Этот код транслирует буквы в телефонный номер:

using System.Text;

namespace Phoneword
{
    public static class PhonewordTranslator
    {
        public static string ToNumber(string raw)
        {
            if (string.IsNullOrWhiteSpace(raw))
                return null;

            raw = raw.ToUpperInvariant();

            var newNumber = new StringBuilder();
            foreach (var c in raw)
            {
                if (" -0123456789".Contains(c))
                    newNumber.Append(c);
                else
                {
                    var result = TranslateToNumber(c);
                    if (result != null)
                        newNumber.Append(result);
                    // Bad character?
                    else
                        return null;
                }
            }
            return newNumber.ToString();
        }

        static bool Contains(this string keyString, char c)
        {
            return keyString.IndexOf(c) >= 0;
        }

        static readonly string[] digits = {
            "ABC", "DEF", "GHI", "JKL", "MNO", "PQRS", "TUV", "WXYZ"
        };

        static int? TranslateToNumber(char c)
        {
            for (int i = 0; i < digits.Length; i++)
            {
                if (digits[i].Contains(c))
                    return 2 + i;
            }
            return null;
        }
    }
}

Сохраняем файл PhoneTranslator.cs , нажатием CTRL+S, и закрываем файл.

12). В Solution Explorer, жмем правой кнопкой мыши на проект Phoneword и выбираем Add > New Item…:

Добавляем новый элемент в проект
Добавляем новый элемент в проект

 

13). В меню Add New Item открываем диалог добавления, выбираем Visual C# > Code > Interface, вводим имя интерфейса IDialer, жмем кнопку Add:

Добавление нового интерфейса
Добавление нового интерфейса

 

14). В файле IDialer.cs, удаляем шаблон кода по умолчанию и заменяем его кодом, указанным ниже. В этом коде определен метод Dial , который должен быть реализована каждой платформе для набора переведенного номера телефона:

namespace Phoneword
{
    public interface IDialer
    {
        bool Dial(string number);
    }
}

Сохраняем изменения IDialer.cs нажатием CTRL+S, закрываем файл.

Замечание. Общий код для приложения сейчас закончен. На уровне определенной платформы код набора номера теперь будет реализован как DependencyService.

15). На вкладке Solution Explorer, жмем правую кнопку на проекте Phoneword.iOS и выбираем Add > New Item…:

Добавляем элемент к проекту Phoneword.iOS
Добавляем элемент к проекту Phoneword.iOS

16). В разделе диалога Add New Item, выбираемApple > Code > Class, вводим имя PhoneDialer, и жмем на кнопку Add:

Добавляем новый класс к проекту iOS
Добавляем новый класс к проекту iOS

 

17). В файле PhoneDialer.cs, удаляем весь шаблон кода и заменяем его на ниже приведенный. Этот код содержит метод Dial который должен быть использован платформой iOS для набора транслированного телефонного номера:

using Foundation;
using Phoneword.iOS;
using UIKit;
using Xamarin.Forms;

[assembly: Dependency(typeof(PhoneDialer))]
namespace Phoneword.iOS
{
    public class PhoneDialer : IDialer
    {
        public bool Dial(string number)
        {
            return UIApplication.SharedApplication.OpenUrl (
                new NSUrl ("tel:" + number));
        }
    }
}

Сохраняем файл PhoneDialer.cs , нажатием CTRL+S, и закрываем файл.

18). На вкладке Solution Explorer, жмем правую кнопку на проекте Phoneword.Android и выбираем Add > New Item…:

Добавляем элемент к проекту Phoneword.Android
Добавляем элемент к проекту Phoneword.Android

19). В разделе диалога Add New Item, выбираем Android > Code > Class, вводим имя PhoneDialer, и жмем на кнопку Add:

Добавляем новый класс к проекту Android
Добавляем новый класс к проекту Android

 

20). В файле PhoneDialer.cs, удаляем весь шаблон кода и заменяем его на ниже приведенный. Этот код содержит метод Dial который должен быть использован платформой Android для набора транслированного телефонного номера:

using Android.Content;
using Android.Telephony;
using Phoneword.Droid;
using System.Linq;
using Xamarin.Forms;
using Uri = Android.Net.Uri;

[assembly: Dependency(typeof(PhoneDialer))]
namespace Phoneword.Droid
{
    public class PhoneDialer : IDialer
    {
        public bool Dial(string number)
        {
            var context = MainActivity.Instance;
            if (context == null)
                return false;

            var intent = new Intent (Intent.ActionDial);
            intent.SetData (Uri.Parse ("tel:" + number));

            if (IsIntentAvailable (context, intent)) {
                context.StartActivity (intent);
                return true;
            }

            return false;
        }

        public static bool IsIntentAvailable(Context context, Intent intent)
        {
            var packageManager = context.PackageManager;

            var list = packageManager.QueryIntentServices (intent, 0)
                .Union (packageManager.QueryIntentActivities (intent, 0));

            if (list.Any ())
                return true;

            var manager = TelephonyManager.FromContext (context);
            return manager.PhoneType != PhoneType.None;
        }
    }
}

Сохраняем файл PhoneDialer.cs , нажатием CTRL+S, и закрываем файл.

Замечание. Обратите внимание, что этот код предполагает, что вы используете новейший Android API.

21). Во вкладке Solution Explorer, в проекте Phoneword.Android, двумя щелчками открываем файл MainActivity.cs , удаляем весь шаблон кода и заменяем на следующий код:

using Android.App;
using Android.Content.PM;
using Android.OS;

namespace Phoneword.Droid
{
    [Activity(Label = "Phoneword", Icon = "@mipmap/icon", Theme = "@style/MainTheme", MainLauncher = true,
              ConfigurationChanges = ConfigChanges.ScreenSize | ConfigChanges.Orientation)]
    public class MainActivity : global::Xamarin.Forms.Platform.Android.FormsAppCompatActivity
    {
        internal static MainActivity Instance { get; private set; }

        protected override void OnCreate(Bundle bundle)
        {
            TabLayoutResource = Resource.Layout.Tabbar;
            ToolbarResource = Resource.Layout.Toolbar;

            base.OnCreate(bundle);
            Instance = this;
            global::Xamarin.Forms.Forms.Init(this, bundle);
            LoadApplication(new App());
        }
    }
}

Сохраняем файл MainActivity.cs , нажатием CTRL+S, и закрываем файл.

23). В секции Required permissions , разрешаем телефону выполнять звонок CALL_PHONE:

Разрешаем телефону звонить
Разрешаем телефону звонить

Сохраняем файл манифеста, нажатием CTRL+S, и закрываем файл.

24). На вкладке Solution Explorer, жмем правую кнопку на проекте Phoneword.UWP и выбираем Add > New Item…:

Добавляем элемент к проекту Phoneword.UWP
Добавляем элемент к проекту Phoneword.UWP

25). В разделе диалога Add New Item, выбираем Visual C# > Code > Class, вводим имя PhoneDialer, и жмем на кнопку Add:

Добавляем новый класс к проекту UWP
Добавляем новый класс к проекту UWP

 

26). В файле PhoneDialer.cs, удаляем весь шаблон кода и заменяем его на ниже приведенный. Этот код содержит метод Dial который должен быть использован платформой Universal Windows Platform для набора транслированного телефонного номера:

using Phoneword.UWP;
using System;
using System.Threading.Tasks;
using Windows.ApplicationModel.Calls;
using Windows.UI.Popups;
using Xamarin.Forms;

[assembly: Dependency(typeof(PhoneDialer))]
namespace Phoneword.UWP
{
    public class PhoneDialer : IDialer
    {
        bool dialled = false;

        public bool Dial(string number)
        {
            DialNumber(number);
            return dialled;
        }

        async Task DialNumber(string number)
        {
            var phoneLine = await GetDefaultPhoneLineAsync();
            if (phoneLine != null)
            {
                phoneLine.Dial(number, number);
                dialled = true;
            }
            else
            {
                var dialog = new MessageDialog("No line found to place the call");
                await dialog.ShowAsync();
                dialled = false;
            }
        }

        async Task<PhoneLine> GetDefaultPhoneLineAsync()
        {
            var phoneCallStore = await PhoneCallManager.RequestStoreAsync();
            var lineId = await phoneCallStore.GetDefaultLineAsync();
            return await PhoneLine.FromIdAsync(lineId);
        }
    }
}

Сохраняем файл PphoneDialer.cs , нажатием CTRL+S, и закрываем файл.

27). На вкладке Solution Explorer, на проекте Phoneword.UWP , жмем правую кнопку на References, aи выбираем Add Reference…:

Добавляем новую ссылку к проекту UWP
Добавляем новую ссылку к проекту UWP

28). В диалоге Reference Manager , выбираем Universal Windows > Extensions > Windows Mobile Extensions for UWP, и жмем на кнопку OK:

Диалог менеджера ссылок
Диалог менеджера ссылок

Замечание. В v10.0.16299.0 Windows Mobile Extensions для UWP должен быть выбран класс PhoneLine .

29). Во вкладке Solution Explorer, в проекте Phoneword.UWP, делаем двойной щелчок и открываем файл Package.appxmanifest:

Настройка файла Package.appxmanifest
Настройка файла Package.appxmanifest

30). На странице Capabilities , разрешаем возможность звонить Phone Call:

Страница разрешений для UWP
Страница разрешений для UWP

Сохраняем изменения в файле нажатием CTRL+S, и закрываем файл.

31. В Visual Studio, выбираем пункт в меню Build > Build Solution (или нажимаем CTRL+SHIFT+B). Приложение будет построено и во вкладке статус бара Visual Studio должно появиться сообщение об удачном построении:

Сообщение об удачном построении
Сообщение об удачном построении

 

Если имеются сообщения об ошибках, то нужно повторить начальные шаги и исправить ошибки до тех пор, пока не будет удачное построение.

32). Во вкладке  Solution Explorer, кликаем правую кнопку на проекте Phoneword.UWP и выбираем Set as StartUp Project:

Устанавливаем проект по умолчанию
Устанавливаем проект по умолчанию

33). В панели инструментов Visual Studio, жмем кнопку Start (треугольная кнопка, которая имитирует кнопку проигрывания) для запуска приложения:

Запущенное приложение UWP
Запущенное приложение UWP

 

34). Во вкладке Solution Explorer, жмем правой кнопкой на проект Phoneword.Android выбираем пункт Set as StartUp Project.

35). На панели инструментов Visual Studio, жмем на кнопку Start  (треугольная кнопка, которая имитирует кнопку проигрывания) для запуска приложения Android в эмуляторе:

36). Если у вас есть устройство iOS и соответствуют требованиям Mac для разработки Xamarin.Forms, используйте аналогичный метод для развертывания приложения на устройстве iOS. Кроме того, развертываем приложение для удаленного симулятора iOS.

Привет, Xamarin.Forms

👁 42 просмотров

Данное подруководство предоставляет введение в разработку приложений на Xamarin.Forms, используя Visual Studio и описывает фундаментальную постройку приложения на Xamarin.Forms. Данный топик будет охватывать такие элементы разработки, как инструменты, концепцию и шаги, которые потребуются для построения и развертывания вашего первого приложения на Xamarin.Forms.

Часть 1. Быстрый старт на Xamarin.Forms

Первая часть будет демонстрировать, как создать приложение, которое будет преобразовать буквенно-цифровой номер, введенный пользователем в числовой номер телефона и затем вызывать этот номер.

Часть 2. Глубокое погружение в Xamarin.Forms

Вторая часть будет рассказывать про развитие построенного приложения в первой части и будет описывать фундаментальную основу работы Xamarin.Forms.

Требования для работы с Xamarin.Forms

👁 45 просмотров

Платформа и система разработки, требуемая для Xamarin.Forms.

Ссылка для установки необходимых инструментов разработки кроссплатформенных приложений.

Целевые платформы

Xamarin.Forms приложения могут быть написаны для следующих операционных систем:

Предполагается, что разработчики знакомы с .NET Standard и Shared Projects.

Поддержка дополнительных платформ

Текущие статусы положения развития возможности разработки ниже представленных платформ находятся на странице Xamarin.Forms GitHub:

  • Samsung Tizen
  • macOS
  • GTK#
  • WPF

Платформы ранних версий

Данные платформы не поддерживаются, если вы решили разработать приложение на Xamarin.Forms 3.0:

  • Windows 8.1 / Windows Phone 8.1 WinRT
  • Windows Phone 8 Silverlight

Android

У вас должны быть установлены последний инструментарий Android SDK и платформа Android API. Вы можете обновить их до последней актуальной версии, используя Android SDK Manager.

Дополнительно, целевая/компилируемая версия для Android проектов должны быть установлены на использование последней установленной платформы. Однако, минимальная версия должна быть установлена на API 15, за счет чего вы сможете продолжить поддержку устройств на Android 4.0.3 и новее. Данные параметры должны быть установлены в Project Options > Application > Application Properties:

Установки для разработки под Android
Установки для разработки под Android

Требование к системе разработки

Приложения Xamarin.Forms можно спроектировать на macOS и Windows. Однако, Windows и Visual Studio должны построить Windows версию приложения.

Требования к системе Mac

Вы должны использовать Visual Studio для Mac для разработки приложений на Xamarin.Forms на версии OS X El Capitan (10.11) или новее. Для построения приложений iOS рекомендуется иметь  iOS 10 SDK и установленный Xcode 8 или выше.

Замечение. Приложения для Windows нельзя построить на MacOS.

Требования к системе Windows

Приложения Xamarin.Forms для iOS и Android можно построить на любом Windows, который поддерживает разработку на Xamarin. Эти требования заключаются в том, чтобы можно было запускать Visual Studio 2017 на версии Windows 7 или новее. Для построения из Windows приложений для iOS необходимо сетевое интегрирование с Mac.

Universal Windows Platform (UWP)

Построение приложений Xamarin.Forms для UWP требует:

  • Windows 10 (Рекомендуется обновить до Fall Creators)
  • Visual Studio 2017
  • Windows 10 SDK

Проекты UWP имеют включеные в Xamarin.Forms решения, созданные в Visual Studio 2017, но нет решений, созданные в Visual Studio for Mac. Вы можете добавить UWP к существующему решению Xamarin.Forms в любое время.

Как построить Bootstrap из исходников

👁 17 просмотров

Настройка инструментов

Bootstrap использует скрипты NPM для их построения. Наш package.json включает подходящие методы для работы с фреймворком, включающие компиляцию кода, запуск тестов и многое другое.

Используя систему построения Bootstrap можно запустить документацию локально, вам всего лишь нужно скачать исходники последней версии Bootstrap и Node.js. В следующих шагах предполагается, что вы готовы к подводным камням:

  1. Загружаем и устанавливаем Node.js, который будет необходим для управления зависимостями Bootstrap;
  2. Переходим в корень папки скачанных исходников /bootstrap  и выполняем команду npm install для установки наших локальных зависимостей, находящихся в списке файла package.json;
  3. Устанавливаем Ruby, устанавливаем Bundler при помощи команды gem install bundler, и в конце запускаем команду установки bundle install. Это должно установить все зависимости Ruby, такие как Jekyll и плагины.

Замечания для пользователей Windows. Необходимо читать это руководство для получения Jekyll и установить без проблем.

Когда вы закончите, вы будете иметь возможность запускать различные команды, предоставляемые из командной строки.

Bootstrap использует скрипты NPM для построения. Наш package.json включает методы для работы с фреймворком, включая компиляции кода, запуска тестов и другое.

 

Использование скриптом NPM

Наш package.json включает следующие команды и задачи:

Задача Описание
npm run dist npm run dist создает папку /dist с скомпилированными файлами. Используются SassAutoprefixer и UglifyJS.
npm test Похоже на npm run dist и плюс это запустит документацию локально.
npm run docs Построение и склейка CSS/JavaScript для документации. Вы сможете затем запустить документацию локально npm run docs-serve.

Обновление WordPress без данных FTP

👁 17 просмотров

В зависимости от настройки серверов обновление движка/тем/плагинов может требовать от пользователя адрес сервера, логин и пароль для FTP. Обычно это происходит, когда веб-сервер запущен от имени другого пользователя. Попробуйте добавить в wp-config.php строку:

define('FS_METHOD', 'direct');

…и обновление будет происходить напрямую.

Знакомство с Blender 3D

👁 43 просмотров

Blender — это бесплатный и Open Source программный комплекс для 3D моделирования и анимации. Простыми словами, для самых зеленых, Blender 3D — это компьютерная программа для воспроизводства высококачественных изображений 3D — моделирования и анимации, используя трехмерную геометрию и математические вычисления. Вы наверняка видели результаты работы этой программы в с фильмах или в бюджетных телевизионных шоу.

Сгенерированная на компьютере 3D графика используется везде. Почти каждый крупный фильм и телевизионное шоу вовлекает в свою работу 3D графику и анимацию. К примеру, каждое спортивное событие акцентирует внимание на анимации, чтобы вывести счет и имена игроков. Но это не только фильмы и ТВ, 3D графика играет главную роль при создании видеоигр, промышленного дизайна, научной визуализации и в архитектуре. В правильных руках можно создать все перечисленное выше и для развития правильных рук будет необходимо набраться чуточку терпения и усидчивости.

Основным преимуществом Blender 3D по сравнению с остальными 3D программами — это то, что он бесплатен для использования и обходится потребителю без оплаты и он же является Open Source  это значит, что даже вы можете участвовать на равне с остальным сообществом в его развитии.

Будучи свободным

Being free of cost, as well as free (as in freedom) and open source, means
that not only can you go to the Blender website (www.blender.org) and
download the entire program right now without paying anything, but you can
also freely download the source, or the code that makes up the program. For
most programs, the source code is a heavily guarded and highly protected
secret that only certain people (mostly programmers hired by the company
that distributes the program) can see and modify. But Blender is open
source, so anybody can see the program’s source code and make changes to
it. The benefit is that rather than having the program’s guts behind lock and
key, Blender can be improved by programmers all over the world!
Because of these strengths, Blender is an ideal program for small animation
companies, freelance 3D artists, independent filmmakers, students beginning
to learn about 3D computer graphics, and dedicated computer graphics
hobbyists.
Blender, like many other 3D computer graphics applications, has had a
reputation for being difficult for new users to understand. At the same time,
however, Blender is also known for allowing experienced users to bring
their ideas to life quickly. Fortunately, with the help of this book and the
regular improvements introduced in each new release of Blender, that gap is
becoming
much easier to bridge.