Only this pageAll pages
Powered by GitBook
Couldn't generate the PDF for 254 pages, generation stopped at 100.
Extend with 50 more pages.
1 of 100

Rock Mobile Docs

Loading...

Getting Started

Loading...

Loading...

Loading...

Loading...

Loading...

Loading...

Essentials

Loading...

Loading...

Loading...

Loading...

Loading...

Loading...

Loading...

Loading...

Loading...

Loading...

Loading...

Loading...

Loading...

Loading...

Loading...

Loading...

Loading...

Loading...

Loading...

Loading...

Loading...

Loading...

Loading...

Loading...

Loading...

Loading...

Loading...

Loading...

Loading...

Loading...

Loading...

Loading...

Loading...

Loading...

Loading...

Loading...

Loading...

Loading...

Loading...

Loading...

Loading...

Loading...

Loading...

Loading...

Loading...

Loading...

Loading...

Loading...

Loading...

Loading...

Loading...

Loading...

Loading...

Loading...

Loading...

Loading...

Loading...

Loading...

Loading...

Loading...

Loading...

Loading...

Loading...

Loading...

Loading...

Loading...

Loading...

Loading...

Loading...

Loading...

Loading...

Loading...

Loading...

Reminders

Loading...

Loading...

Loading...

Loading...

Loading...

Loading...

Loading...

Loading...

Loading...

Loading...

Loading...

Loading...

Loading...

Loading...

Loading...

Loading...

Behaviors

Welcome 👋

Rock Mobile is a native mobile extension of Rock RMS. This site is the documentation for building mobile applications that are linked to Rock.

This documentation will help you with building your Rock Mobile application. Be sure to check back regularly for updates. You can browse this documentation using the sidebar on the left or by searching in the top right (use the keyboard shortcut Ctrl+K).

There's also a community of like-minded mobile developers in the ! Join the #mobile channel and ask questions to others using Rock Mobile, or help provide answers.

community chat
Cover

Release Notes

Keep an eye on new features and bug fixes.

Cover

Report Issues

Let us know if you have problems with the shell.

Cover

Become a Contributor

Want to help improve this mobile documentation?

Creating An App

Let's begin by creating a new mobile application within Rock. Mobile applications can be found under Admin Tools > CMS Configuration.

Select the Mobile Applications box to view a list of all the apps in your Rock instance.

Click the Plus icon to create a new app, or select a previously created app from the list below.

Lexicon

Below are a few of the basic terms that will help you come up to speed as you start navigating the documentation and begin your first mobile app project.

Blocks

Rock Mobile uses blocks the same way as Rock Web does. You create pages, add blocks to them, and configure them. Then when you deploy your app all that information will get bundled up so the mobile app knows how to communicate with your site.

Note that Page and Block security only works for Roles, not individual User accounts.

Many blocks are self-explanatory, though we're not saying they don't need some documentation too. We'll continue adding some helpful hints about all the blocks, such as what is available in Lava merges and what-not.

Integrated Scroll

In some cases, you may want a block to stretch to the full height of the zone (in 99% of cases, this entails the entire screen). In Xamarin, this was achieved by the use of a now-deprecated FillAndExpand property.

In MAUI, this is achieved through the use of an attached property. Within the block, you want to expand add a Rock:Zone.Expands="true" property on the outermost layout.

Content Collection View

Universally search across multiple different content sources, with filter and sort options.

Content Collections use Universal Search and indexing, which means they do not support entity security.

This Content Collection View block is designed to bring your content collections to life. It offers powerful search and filtering tools that work across all items in your collection, delivering results at incredibly fast speeds. Learn more about Rock's Content Collection feature here in the manual:

Bindings

Parameters

Settings

Application

Includes all of the Rock Mobile blocks, content, branding, and other configurable areas. Most visual elements are found here.

App Factory

Required publishing service for all Rock Mobile apps ()

Core

The Rock server powering your app ()

Deploy

A button in Rock you can click to send out changes for all app users including configuration, pages, blocks, and content.

Device Type

This is the type of device that the application is running on. The only two options are Phone and Tablet.

Downhill CSS

The style framework included with Rock Mobile ()

Publishing

The process by which App Factory distributes your apps into the Apple App Store and Google Play Console. This only includes new Shell versions, not content changes.

Platform / Operating System (OS)

This is the platform that the application is running on. The options include iOS, iPadOS, and Android.

Rock Mobile Core

An app used for testing the latest production version of the Shell. You may have heard this referred to as the "orange app" and used it for the RX conference. |

Rock Mobile Latest

An app used for testing the latest pre-alpha version of the Shell, commonly referred to as the "blue app". |

Shell

Handles the tricky stuff like navigation, authentication, API calls, and more. The Shell is updated and maintained by the development team at Triumph Tech, whereas everything in the Application layer is under your control, built upon the Shell.

TestFlight ()

Apple's service for testing apps that aren't published in the App Store. App Factory will send your iOS app here for review first.

If there is missing or unclear documentation, please feel free to file a documentation request on our .

Some blocks will have built-in scrolling mechanics. This means that the in which the block resides should not be placed within any sort of layout that provides scrolling (such as ScrollView). These blocks will have a special badge in the documentation, that looks like this:

Mark a block to expand vertically

Currently, for other block types (blocks with the tag), we have an internal flag that gets set to mark a block to expand.

Name
Type
Description
Key
Type
Description
Name
Description

IsLastItem

bool

This is true when outputting the last item in the filtered results. It is useful for skipping the divider beneath the final result at the bottom.

<Rock:Divider IsVisible="{Binding IsLastItem, Converter={Rock:InverseBooleanConverter}}" />

AutoFocus

bool

Determines if the keyboard should open automatically on page load.

see more
see more
see more
Apple App Store
Google Play
Apple App Store
Google Play
link
issues board
Zone

Content Collection

Show Filters

Whether or not the filters should be displayed as an option for this block.

Show Full-Text Search

Whether the search field should be enabled for this block.

If disabled, enabling Search On Load or passing in a pre-defined search term is advised.

Show Sort

Whether or not the sort options should be enabled.

Number Of Results

The number of results to load with each search. This block searches as the page is scrolled, so this will be the number of results returned per each load.

Search On Load

If enabled, the block will search upon load.

Group Results by Source

Whether or not the results returned should be grouped by the content source. You can customize the header of each group by modifying the Group Header Template.

Enabled Sort Orders

The options for sort to provide for the block.

Trending Term

The term to use for the "Trending" sort option.

Filters

This section allows you to customize filters based on the selected Content Collection configuration.

Group Header Template

The lava template to use to render the group headers. This will display above each content collection source.

Only useful if Group Results By Source is enabled.

Item Template

The XAML template to display for each item. The operation of loading XAML for long lists is expensive, so take caution to follow best layout practices.

Pre-Search Template

The template to display before someone has searched once.

Boost Matching Segments

Determines if the matching personalization segments should receive a boost.

Boost Matching Request Filters

Determines if the matching personalization request filters should receive a boost.

Segment Boost Amount

The amount of boost to apply to matches on personalization.

Request Filter Boost Amount

The amount of boost to apply to matches on personalization.

App Configuration

Now it's time to configure your app. There are some options that are not covered below; they are beyond the scope of this walkthrough. Start by filling in the Application Name and optional Description.

Don't worry too much about the name you enter. It will be used to identify your application in Rock but has no effect on the official app name once deployed to the app stores.

Application Type

You have three options when it comes to the Application Type. Choose what makes the most sense for your app; you can always change your selection later.

Blank (not recommended)

This option will not provide a Flyout panel or tabbed navigation. Generally you'll want one of those, so Blank should only be selected when you need to remove those elements for a specific use case.

Flyout (recommended)

This is the most common type of application and one your users will be familiar with. A menu icon (three horizonal bars) will be displayed in the top left of your app and when pressed will reveal a slide out panel form the left side. Users can also swipe from the left side of the screen to reveal the Flyout panel.

Tabbed

When this option is selected users will be shown a tabs at the bottom of the app. If your app only has a few top-level pages this can be a great alternative to the Flyout. Each page can have a custom image associated with it which is displayed above the name.

Lock Orientation

You can force the application to be locked in Portrait or Landscape mode for both phones and tablets. Generally you'll want to leave these set to the defaults of Portrait for the phone and empty for the tablet.

Application Pages

You'll have the option to set the Login, Profile, and Communication View pages here... but we haven't created them yet. Although this guide won't dig into setting these up, know that coming back to add these page links is important for the app to understand where these fundamental areas exist for navigation.

API Key

Be aware that certain special characters will not compile when it's time to publish through App Factory. We recommend sticking to letters and numbers for your API Key.

Bad: mobileapp, Rock, testing Better: Gr33nToolb0x, ctr2p7

Flyout XAML

If you've selected an Application Type of Flyout then you can customize what appears inside via XAML. The default template will include a <ListView> that references a {Binding MenuItems} source; this will automatically add any pages with the Display In Navigation option checked. It is recommended to leave this alone unless you need custom functionality.

Lava will not work inside the Flyout XAML; if you add some the app will crash upon opening.

Homepage Routing Logic

Adding Content

When saving a new app, or selecting an existing one from the list, you'll be taken to the Application page. The title bar will show the name of your app on the left and the Site/App Id on the right, as well as the deployment status. Underneath you'll find tabbed navigation for the different areas of your app and some of the configuration values you previously selected.

To begin adding content to our app we need to navigate to the Pages area. The homepage has already been created for you. Selecting this page will bring you to the page details area where you can change the configuration and add blocks, similar to the process on Rock web.

Let's add our first block by selecting the Content block and dragging it into the Main section.

Once added click the Gear icon to change the block properties. In this Content block we'll add our first lines of XAML. Let's add a label and card to our page with the XAML below:

<StackLayout StyleClass="p-16"
    Spacing="16">
 
    <Label Text="News Feed"
        StyleClass="h4" />
    
    <Rock:ContainedCard Image="https://realchip.rocks/Content/Chip%20Rocks/Images/Chip%20Sticker@4x.png"
        Tagline="ANNOUNCEMENT"
        Title="Welcome to Rock Mobile"
        ImageRatio=".75:1">
        Check out just how easy it is to create a new mobile app for your organization...
    </Rock:ContainedCard>
    
</StackLayout>

Below the content input are some options for enabling Lava commands and selecting if block is Dynamic Content. If enabled, making changes to the XAML content will be shown upon refresh of the page instead of requiring a full redeploy.

Clicking Save will add our XAML to the block. Now let's deploy our application and view it on a device.

Content

Displays custom XAML & Lava content on the page.

For example, you could use it to display a simple label:

Block Configuration

Dynamic Content This setting is extremely useful. When checked, it will download fresh content from the server every time the page is initialized. In a sense, it causes the content to "refresh" every time the page is loaded.

We recommend setting this to Yes unless there's a specific reason to leave it turned off.

If you have static, unchanging content, you can leave this as a No. This means that a Deploy will be required before the content is updated in-app. Behind the scenes, this content will be baked into the shell bundle that's downloaded during the app launch. Lava will still be processed, but you won't have a CurrentPerson context.

Using Lava

After the content, the second block setting to discuss is the "Enabled Lava Commands". If you have a Lava command within your Content, it is important to make sure to check the applicable settings here. It is also just as vital to make sure that you check the "Process Lava on Server" setting within the 'Block Properties > Mobile Settings', as seen here:

Entity Context

Using the Context Entity Type setting in the block, you can select any of the available entities.

Next, you'll need to set the context parameter for the page. This is how the block will know where to find the context identifier. This setting is found by editing the Page (not the block) and expanding the Advanced Settings section. Based on the entity type you chose, you should see a setting labeled {{ Entity }} Parameter Name. Add a parameter key that makes sense for your data.

It's generally recommended to pass context via GUID in Rock Mobile.

Now that you've set the block entity type and page context parameter, be sure to Save and Deploy. The final step is to simply link to your page and pass the appropriate context via the key you set. Going back to the example of the person profile page, you might end up with something like this:

Accessing the entity follows this syntax: {{ Context.EntityType.Property }}

The to search across.

Think of this key like a credential to connect to your mobile app. You'll use it with some other fields to access your application in a . Set the value to something relatively complex and unique to your organization, but still easy to type on a mobile keyboard.

This is the logic to use to determine the homepage of the application. Lava is enabled, including access to .

First we started with a , which can display any number of child elements in a vertical orientation. Next we added a control with some text and a style class. Finally we added a with some various text properties.

Page contents should be wrapped inside a to allow for rendering of multiple child elements. It's generally recommended to use a <StackLayout>.

Arguably the most fundamental block in any Rock Mobile application, this block could be described as a necessity, used to render Lava and XAML within your shell, as provided in the "Content" block setting. If you are unfamiliar with XAML, please refer to the . If you are unfamiliar with Lava, please check out the .

Or use it to implement more complex views, such as a .

With just a few settings, you can wire up context to the Content block making it even more powerful! Maybe you want to create a profile page for people based on results. Instead of running Lava in the content to pull the needed data, let the block set the person context for you.

Within your Content block, you can check that the context isn't null and begin accessing the entity. If context wasn't set correctly, consider a graceful fallback to another page via .

content collection
future section
StackLayout
Label
Contained Card
Xamarin Forms layout
<Label Text="Hello!" />
<StackLayout>
    ...
    <Button Text="Profile"
        StyleClass="btn, btn-primary"
        Command="{Binding PushPage}"
        CommandParameter="3446dcac-0078-4ba4-a19a-65ce8b7fb776?Guid={{ Person.Guid }}" />
</StackLayout>
<StackLayout>

    <!-- If context isn't set, fall back to page and display error message -->
    {% if Context == null %}
        <Rock:Redirect PageGuid="82370b8d-0fea-4454-8ad7-7e7c950e3345"
            QueryString="Message={{ 'Unable to find person' | UrlEncode }}" />
    {% endif %}
    
    <!-- Context has been set -->
    <Label Text="{{ Context.Person.NickName | Escape }}" />
    
</StackLayout>
Redirect
official Microsoft documentation
Rock Lava Reference
Search
entity

Hero

Displays an image with text overlay on the page.

Want big, styled images that you can overlay with Lava content? You're in the right place. Hero images are a great way to attractively display a picture with text overlay.

Example

This is an example of a display created using this block. The Background Image was set to a stock photo, and to render the title, the block setting was set to {{ CurrentPerson.FirstName }}.

Using Lava

Block Settings

Title

The main title that overlays the Background Image. Lava enabled.

Subtitle

The text that overlays the image, underneath the title. Lava enabled.

Background Image

Phone: The image to display on a phone. Recommended to be at least 1024px wide, and at least double the height of the Height - Phone setting.

Tablet: The image to display on a tablet. Recommended to be at least 2048 pixels wide, and at least double the height of the Height - Tablet setting.

Height

Phone: The height of the rendered image on a phone.

Tablet: The height of the rendered image on a tablet.

Text Align

This setting allows you to align the overlayed text to the left, center or right side of the image.

Title Color

Subtitle Color

Padding

Deploying Your App

Deployment

Navigating to the Application page for your app shows the deployment status in the top right. New apps start as Not Deployed, so you'll need to click the Deploy button in the bottom right corner to test your app. The first deploy may take a few moments, but generally this process happens quickly.

Note that making changes to the app (like adding new pages and blocks or changing block settings and application colors) will require you to Deploy again, as well as reloading the app, to see the changes. Changes to Content blocks that have a Dynamic Content value of Yes will be shown without a new deployment. When a user opens the app and is shown the splash / launch screen the app is pulling the latest deployment from your server (or wherever your bundle is hosted).

Testing

The best way to test your application is using the Rock Mobile Core app available on the app stores.

Simply tap and hold the screen with two fingers and a small popup with app information will appear. Tapping the App Switcher button will allow you to change the server to which the app connects.

The App Switcher page has three fields that are required to connect to your server. All of this information can be found by navigating to the application's internal page (under Home > CMS Configuration > Mobile Applications) and selecting your app. Let's take a look at each of them.

Application Id

This is the ID given to the application by Rock when it is created. It cannot be changed. To find your application ID, navigate to the Application page and find the Site/App Id in the top right. Alternatively, you can see the number in the URL bar.

API URL

API Key

This was configured when creating your application. You can change this value during development, but any apps using this key will need to update their App Switcher page in order to connect again.

You should not change this value after your app has been deployed to the stores. If it needs to be changed for any reason please reach out to App Factory for assistance.

When finished, your form will look something like this:

Tap the Launch App button to connect and view your app. The App Switcher page will remember what you've entered so you only have to do this once.

If the connection fails, double-check that you've inserted the correct values and haven't mistyped anything. Also, be sure that your app has been deployed and has a green status tag.

Rock Core App Connection

You can always connect back to the original Rock Mobile Core app if needed:

App Id 36

API URL https://www.rockrms.com/api

API Key rocksolidpihc

Publishing

In order to use Lava in this block, please make sure to enable the 'Process Lava on Server' under the 'Block Settings > Mobile Settings'. If you are struggling to find or enable this setting, is a good example.

If you are unfamiliar with Lava, please check out our .

Sets the color of the .

Sets the color of the .

The padding around the inside of the .

Note that the shell cannot connect to localhost without additional tooling like or something that can expose Rock to the web.

Apple / iOS: Google / Android:

This is simply the URL to your Rock server's API. The Public Application Root with /api will be your URL. For example:

When it comes time to publish your app into the stores, get started with .

Lava Reference
here
Title
Subtitle
Background Image
App Factory

Building Your First App

This guide will walk you through the process of creating a new mobile application in Rock: adding some content, deploying, and finally testing with the Rock Mobile Core app. When we're finished you'll have everything you need to begin building the app of your dreams.

ngrok
https://apps.apple.com/us/app/rock-mobile-showcase/id1498547817
https://play.google.com/store/apps/details?id=org.sparkdevnetwork.rockmobile
https://www.rockrms.com/api

Lava Item List

List items generated by Lava.

Block Configuration

Page Size

The number of items to send per page.

Detail Page

The page to redirect to when selecting an item.

List Template

The Lava used to generate the JSON object structure for the item list.

List Data Template

The XAML for the lists data template.

Merge Fields

In the template, you have access to these objects:

Field
Type
Description

Page

int

The page number whose items are returned, the first page being 0.

int

The number of items to send per page.

Login

The block used to log an individual in to your mobile application.

The purpose of this block is pretty obvious, but in case you are unsure, it is to log a registered individual into your application using a Rock credential.

If you need to set up registration, check out the Register or Onboard Person blocks.

Login Page App Setting

When you create an instance of the Login block, it would be a good idea to also set the Login Page application setting. This allows the app to perform auto-security redirects and is used in a couple of other places functionally.

Settings

Property
Description

Registration Page

The mobile page to open when the Register button is tapped. Leave this option blank if you want to hide the Register button.

Forgot Password URL

The URL that is opened in an external browser when the Forgot Password button is pressed. Leave this option blank if you want to hide the forgot password button. This URL is typically [[ YourRootDomain ]]/ForgotUserName

Confirmation Page

Set to a web page on your public site that has been configured to handle account confirmation. If this option is left unset, it will not send the communication configured to confirm an account. External Homepage > Support Pages > Account Confirmation

Confirm Account Template

Set to the communication template you wish to use when an individual needs to confirm their account. If the Confirmation Page is not set, this communication will not be delivered.

The page to return to after an individual has successfully logged in. If this is not set, it will default to the Home page.

The page to return to after tapping the Cancel button. If this is not set, it will default to the Home page.

Page Parameters

The following page parameters are recognized by the Login block.

Key
Type
Description

ReturnPage

Guid

The page to show once login has successfully completed. Takes precedence over the block setting.

External Authentication

This will change (in Microsoft Entra only) the logic to use an external browser instead of an internal one. For Fido2/Passkey support, this must be set to false.

Listed below is the corresponding documentation for every external authentication provider that can be integrated with Rock Mobile.

If/when more are added, corresponding documentation will be added to this section.

When considering integration with external authentication, be mindful of the UX change for your users. Rock uses credentials (username and password) to log people in. In many cases, people enter their email address as their username and likely assume the login is directly linked to that email, but it is not. This changes when external authentication is used.

External authentication is typically linked to another account that is directly tied to an email. If this is an email address shared between family members, a person match will not occur, and a duplicate will be created. Individuals will not be able to share an email in this way.

Return Page

Cancel Page

Use Embedded Web View For External Authentication

Using Auth0
Using Entra
PageSize
Book Contents | Rock Community
Logo

CMS

This section refers to the 'CMS' mobile block group.

Content Channel Item View

Displays a content channel item by formatting it with XAML.

This block is useful for quickly displaying content channel items like messages or promotions. Instead of writing an entity command to get the data, this block will pull the full content channel item for you.

It functions similarly to the Content block in that the XAML template is up to you to define. Its advantage lies in the built-in data pull and optional interaction write so you don't have to wire them up yourself.

Parameters

Context can be provided to the block via item Id or Guid; you don't need to pass both.

When passing multiple parameters to the page, ensure this one is first, or the block context will not be set.

Name
Type
Description

ContentChannelItemId

Int

The Id of the content channel item.

ContentChannelItemGuid

Guid

The Guid of the content channel item.

Settings

Name
Description

Content Channel

Limits the retrieved item to a specific content channel.

Log Interactions

If enabled, an interaction associated with the content channel item will be added to the queue.

Template

The Lava commands that are enabled for this block will only Lava rendered on the server.

Merge Fields

Property
Type
Description

Item

ContentChannelItem

The full Content Channel Item that was retrieved.

Using Entra

Provide Microsoft Entra (formerly Azure AD) as an authentication provider within your Rock Mobile application.

What is Microsoft Entra

Setup

To ensure Entra works perfectly in Rock Mobile, follow this step-by-step guide.

  1. Add permissions for our mobile application to retrieve necessary data points.

  2. Ensure our authentication returns enough information to the Rock server.

  3. Configure your Rock Mobile to support Entra.

1. Registering the app

b. Configure the Register an application screen considering the information below.

Name

Provide a name for your Rock Mobile app registration. Nothing really hinges on this.

Supported account types

This is really up to you. If you're limiting Entra login to staff, then the Accounts in this organizational directory only is likely the right choice.

Redirect URI

If you need assistance acquiring the <BundleId/PackageName> please reach out to the App Factory team.

This is important. This needs to be formatted like <BundleId/PackageName>://entra/callback, otherwise authentication won't work. If your bundle identifier and package name differ, you'll have to add a Redirect URI for both (App Registrations > Your App > Authentication).

Ensure that the type of Redirect URI is set to Public client/native (mobile & desktop).

2. Add necessary permissions

We need to ensure that our mobile application has permission to see the necessary data of a newly authenticated user.

a. Navigate to your newly created app registration, then to API permissions > Add a permission.

b. Select Microsoft Graph.

c. Select Delgated permissions, check email, openid and profile permissions. Press Add permissions.

3. Add optional claims

Rock requires a First Name, Last Name and either a valid Phone Number or Email to process external authentication. You should take steps to ensure that those specific data points are always returned from Auth0 authentication.

Out of the box, Entra will not return the first name and last name of an authenticated person to the shell. Rock needs this information to process/person match etc., so we need to go in and add these data points.

a. Under your newly created app registration, navigate to Token configuration > Add optional claim.

b. Select ID as the Token type, and check email, family_name (last name) and given_name (first name). Press Add.

4. Configuring Rock Mobile

a. Jump into your Rock Mobile application (CMS Configuration > Mobile Applications > Your application > Edit).

b. In the Authentication Settings section, we're going to be configuring the Microsoft Entra settings.

Entra Client ID & Entra Tenant ID

Microsoft Entra Authentication Provider

c. Configure the Login block to provide Entra as an SSO option.

Supported Claims

The following identity claims are supported and can be utilized to supply additional information about a Rock Person. Since Entra configurations can vary, we supply a few different keys that are recognized and translated accordingly.

Key(s)
Type
Value

firstname, first_name, given_name

string

The FirstName of the Person.

lastname, last_name, family_name

string

The LastName of the Person.

phone, phonenumber, phone_number

string

The PhoneNumber of the Person.

campus, campus_guid

Guid

The Guid of the Person campus.

photo, picure, profile_image, avatar

string

The source of the Person profile image.

nickname

string

The nickname of the Person.

birthday, birth_date, birthdate, date_of_birth

DateTime

TheDateTime representation of the Person date of birth.

gender

string

The Gender representation of the Person. Can be interpreted as the enum integer or corresponding string value.

If you are building your app utilizing the orange/blue Rock Mobile application and would like to test Entra, you should coordinate your efforts with the publishing service.

is a cloud-based identity and access management service that is typically used for employees. It can be used to effectively manage authentication, security and much more at an extremely scalable level.

Create and configure a new in the Azure AD Portal.

a. In the , navigate to Applications > App registrations > New registration.

To retrieve your Entra Client ID and Entra Tenant ID, jump into the , your newly created app registration, into Overview. The values will be displayed.

Select the same authentication provider that provides Entra login on web. In almost all cases, this component is either the plugin or .

App Factory
Microsoft Entra ID
App Registration
Entra admin portal
Entra portal
Triumph Tech Azure AD Sync & SSO
BEMA Single Sign On plugin

Workflow Entry

Displays a native workflow form.

Not all Rock field types are supported by this block. Those that aren't will be omitted within the app. See Field Types for more info about which types are supported.

Page Parameters

Name
Type
Description

WorkflowTypeGuid

Guid

Sets the workflow type context for the block if the Workflow Type block setting is empty.

This parameter will not override the block setting

Block Configuration

Daily Challenge Entry

Displays a set of challenges for the individual to complete today.

This one is going to be a challenge to describe, but we'll get you up to speed on how to use it. This block allows you to build a visual interface to provide challenges to your people. These challenges span multiple days and comprise one or more individual challenge items on each day. An example might make more sense of what we are talking about.

Let's suppose you want to have a 7 day "Get to Know God" challenge. Each day they are prompted to complete two tasks: Prayer and Bible reading. Each day would give different instructions about what to pray for and what verses to read. When they first land on the page hosting this block they will see the challenge items for day 1. After they tick those off they might see a "way to go" type message. Then the next day when they return they will see the items for day 2, and so on. Once they finish day 7 and come back the next day they start on day 1 again.

Lava Reference

When your lava template is parsed, you will get a number of merge fields to help you render the daily challenge. There is some sequence of operations you will need to be aware of.

First, you will probably want to check if the CompletedChallenge merge field is not null. If it contains a value then that means the user just finished the final challenge item for a day. In this case, you likely want to display some kind of "well done" message, or possibly switch to a read-only view that removes the check-boxes - since trying to uncheck an item from a fully completed day is not allowed. In this case, the Challenge merge field may contain either the same object as the CompletedChallenge or it may contain what the system thinks is the "next" daily challenge, depending on the situation. But generally you probably don't want to just display whatever is in the Challenge at this point.

Secondly, if the MissedDates merge field contains any values then those should be displayed to the user and must be filled in before you display the challenge in the "Challenge" merge field. Otherwise, they will start a new challenge. Also, the MissedDates must be filled in sequentially. Meaning, if they missed two dates they need to fill in the challenge for the first date and then the second date, otherwise it will also break the challenge and start them over. The default template displays just the first date of the array.

You can have both a CompletedChallenge value as well as items in the MissedDates array. For example, say there are two missed dates and you have them continue and fill out the first missed date. Upon completion, your CompletedChallenge merge field will contain the first missed date challenge they just completed and your MissedDates array will now have a single item for the second day they had missed.

Merge Fields

  • MissedDates - An array of dates that indicate the user has missed one or more dates in their current challenge that they can still go back and fill in. Note that this merge field will be empty if you have requested by any means that a specific challenge be shown.

  • TodaysChallengeGuid - The unique identifier of the daily challenge that indicates today's challenge. This can be different than the Challenge value in as it takes into account an ongoing challenge where they might have skipped some days. One exception to this is if you pass a query string parameter of DailyChallengeGuid to request a specific challenge then this value will match that challenge.

Object Structure

ChallengeState

  • Guid - The unique identifier of the daily challenge.

  • IsComplete - Will be true if the individual has completed the challenge corresponding with this day.

DailyChallenge

This object contains all the details about a single day of a challenge.

  • Guid - The unique identifier of the daily challenge.

  • HeaderContent - This contains the same text content as the "Content" box when editing the "Day 1", "Day 2", etc. items. This is normally displayed at the top of the page before any checkboxes.

  • IsComplete - Will be true if the individual has completed this daily challenge already. For example, if they have just checked the last checkbox, or if you are linking directly to a previously completed daily challenge.

  • AttributeValues - If you defined any custom attributes for the daily challenge then they will show up here. This is a dictionary of attribute keys and string values.

ChallengeItem

This object contains the information about a single checkbox item that will be displayed for the user to complete.

  • Guid - The unique identifier of the challenge item.

  • Title - The text from the content channel item title. This is normally displayed next to the checkbox.

  • Content - The text from the "Content" box of the content channel item.

  • AttributeValues - If you defined any custom attributes for the challenge item then they will show up here. This is a dictionary of attribute keys and string values. You can use this to provide custom rendering logic to your lava template. It will not include the "InputType" value.

ChallengeItemValue

Contains the user-supplied information about a single challenge item. Meaning, if it has been completed and any custom user value that was entered.

  • Guid - The unique identifier of the challenge item this value is for.

  • IsComplete - Will be true if the checkbox is checked.

  • Value - Contains any custom value the user has typed into a text field for this item.

XAML Bindings

So your lava template will set up the initial XAML content to paint the page. But how do you link user actions (like tapping a checkbox) back so it actually does something? There are some special bindings available to you:

  • Challenge.ToggleChallengeItem - A command that toggles a checkbox on or off. The command parameter is the item unique identifier.

Okay, so those are the XAML bindings available. But examples certainly make more sense than just the description. For a moment, lets imagine that all we are going to display is a checkbox and the name of the item to be completed. So we will loop through the Challenge.ChallengeItems array and render out a horizontal stacklayout to contain our checkbox and then the label.

Most of that should look pretty normal to you. We have a bit of a mix between lava and bindings. In some places we are using lava to display a value (for example, the Label text). In others, you will notice we are using binding values. The binding value means it will actually persist the change in value. If we had used a normal lava "if" statement then it wouldn't automatically update or track the change in value.

But, that binding syntax is probably not what you normally see, so let's break it down. There are two parts to the binding, first is the path and then the converter. Let's take a look at that path first.

Challenge.ItemValues[{{ forloop.index0 }}].IsComplete

This is binding to the array Challenge.ItemValues and then binding to a specific item in the array, identifies by {{ forloop.index0 }}, which is the index of the item being processed in the loop. Finally, in that particular indexed object we are binding to the IsComplete property. Next is the converter.

{Rock:BooleanValueConverter True=check-circle, False=circle}

What we are doing here is taking that boolean value from the IsComplete property and running it through a converter that will return different values depending on if the value is true for false. If it is true we return check-circle and if it is false it returns circle. This gives us the allusion of a nice checkbox that we can style ourselves.

You might wonder why we didn't just use an actual checkbox. The reason is that the checkbox doesn't have a Command. And when you bind the value of the checkbox to the IsComplete property it won't properly pick up the fact that we might reject the change in value if it isn't allowed.

Setup

So how do you set up these challenges? You are going to use a Content Channel to do that. You will also need to setup 2 Content Channel Types (if you set up multiple challenges you can re-use these channel types).

Content Channels Types

The first content channel type will hold the challenges that you are going to set up, in this case we are talking about your 7-day "Get to Know God" challenge. To create a general use Content Channel Type for these challenges. Create a new Content Channel Type with the following settings:

  • Name = Multi-Day Challenge

  • Date Range Type = No Dates

  • Disable Priority = Yes

  • Disable Status = Yes

  • Show in Channel List = Yes

Next, create a second Content Channel Type that will hold the individual items to be completed each day.

  • Name = Challenge Items

  • Date Range Type = No Dates

  • Disable Priority = Yes

  • Disable Status = Yes

  • Show in Channel Lists = Yes

  • Item Attributes

    • Name = Input Type

    • Field Type = Single-Select

    • Values = Text,Memo

    • Control Type = Drop Down List

The item attribute allows you to specify that the challenge item should have a (required) input field. You can also define other item attributes and these will be included in the Lava so you can better customize how things are displayed.

Content Channels

First, we are going to create the content channel that will hold the individual challenge items to be completed each day.

  • Name = Challenge Items

  • Type = Challenge Items

  • Default Content Control = Code Editor

Now you need to create a Content Channel for the actual 7-day challenge.

  • Name = Get to Know God

  • Type = Multi-Day Challenge

  • Child Content Channels = Challenge Items (the one you just created above)

  • Items Manually Ordered = Yes

  • Child Items Manually Ordered = Yes

You can also add Item Attributes to this channel. These will apply to the individual days (Day 1, Day 2, etc) and be made available to you in Lava. This allows you to customize each day if you want.

Day Items

It may seem obvious, but you need to create a Content Channel Item inside your "Get to Know God" channel for each day. To keep things simple, just create 7 items titled "Day 1", "Day 2", and so on up to "Day 7". If you get things out of order, you can use manual sorting to put things in the proper order. That order is used to determine the order of the days, not the title.

All you really need is the Title, but you can enter some XAML in the Content that will be displayed at the top of the page when viewing that day's challenges.

Challenge Items

Go into "Day 1" and create a new child item.

  • Title = Pray for 15 minutes

Then add a second item to be the challenge item for reading the bible.

  • Title = Read the Bible

  • Content = <Label Text="Genesis 1:1-18" />

So we now have two items that will be displayed for "Day 1". The first is a checkbox with the title "Pray for 15 minutes" and no additional content. The second item will be a checkbox with the title "Read the Bible" and then below that it will display the verses that they are supposed to read.

To complete this you would do the same for "Day 2" through "Day 7". And obviously you can use different verse references. You can even have them in different order or additional items to be completed on certain days.

The default lava template expects you to use XAML inside the Content fields for both the Day content channel items and the individual challenge item content channel items. If you try to use just a plain text string it will throw a rendering error.

This is an extremely powerful block for managing workflows from a mobile application. If you aren't sure what workflows are quite yet, please refer to , a Rock manual that goes over the subject.

This block does not currently support Conditional Display Logic and will only respect the Visible, Editable and Required attributes of the field. In cases where conditional logic is required, you should consider using an external browser or a .

Workflow Type

The type of workflow that is to be launched when a page containing this block is rendered. To manage your existing workflow types navigate to 'General Settings > Workflow Configuration'.

Completion Action

The completion action can be set to one of three different options.

  1. Show Message From Workflow: The block will display the configured message in the workflow settings.

  2. Show Completion Xaml: The block will display the XAML set in the block setting. Within this template, the workflow attribute values can be accessed as usual: {{ Workflow | Attribute:'Key' }}

  3. Redirect to Page: The block will redirect the individual to the page set in the Redirect To Page block setting.

Completion XAML

The Xaml to render upon completion. Note that the must be set to Show Completion Xaml.

Enabled Lava Commands

The lava commands that this block is allowed to use. Note, that if your workflow utilizes Lava, you must match these settings to give your workflow full functionality. Please note that you may have to also enable the 'Process Lava on Server' setting in the 'Mobile Settings' of the block. A good example of how to find and enable that setting is seen .

Redirect To Page

This is the page in your mobile app to redirect to upon completion. Note that the must be set to Redirect to Page.

If both MissedDates is empty and CompletedChallenge is null, then the Challenge merge field contains the that needs to be displayed for the user to complete. You will need to check the IsComplete property to determine if this is a challenge that has already been completed and if so display it in a read-only manner.

Challenge - The current . This is normally the challenge that should be displayed. However, if there are any MissedDates then this value will be for "Day 1" and start a new challenge. If you wish to allow the individual to continue their previous challenge you must first have them complete any missed dates (in order).

CompletedChallenge - This will be set to the that the user completed upon clicking the last checkbox. It can be used to draw different content (like a "well done" message) once they have completed all the challenges for a day.

Progress - This contains an array of objects that show you the progress of their current challenge. This is an ordered array where the first item in the array corresponds to "Day 1" and the last item in the array corresponds to the last day of the challenge.

ChallengeItems - An array of all the objects (checkboxes) for this specific day. These will already be in the order you defined.

ChallengeItemValues - A dictionary that contains any values for the ChallengeItems. The dictionary key is the item unique identifier and the value is a object. If you are building a read-only view of the challenge you can use these values. However, if you are building an editable view then you will want to use the bindings version.

InputType - This is a special use attribute. If it is not blank then the internal block logic will require the user to enter a value in the 's Value property.

Challenge.ItemValues - An array of . This array is in the same order as the one provided to your lava template.

Challenge.ShowChallengeForDate - A command that will run your lava template again with the for the date. The command parameter is the value from the MissedDates array.

Challenge.ShowCurrentChallenge - A command that will run your lava template again with the specified . The command parameter is the unique identifier of the to be shown.

Blasting Off With Workflows
WebView
{% for item in Challenge.ChallengeItems %}
    <StackLayout Orientation="Horizontal" Spacing="0">
        <Rock:Icon IconClass="{Binding Challenge.ItemValues[{{ forloop.index0 }}].IsComplete, Converter={Rock:BooleanValueConverter True=check-circle, False=circle}}"
            TextColor="{Binding Challenge.ItemValues[{{ forloop.index0 }}].IsComplete, Converter={Rock:BooleanValueConverter True=#EF8903, False=#C3CED1}}"
            Margin="0 8 0 0"
            VerticalOptions="Center"
            Command="{Binding Challenge.ToggleChallengeItem}"
            CommandParameter="{{ item.Guid }}" />
                    
        <Label Text="{{ item.Title | Escape }}"
            VerticalTextAlignment="Center"
            VerticalOptions="Center"
            StyleClass="challenge-title">
            <Label.GestureRecognizers>
                <TapGestureRecognizer Command="{Binding Challenge.ToggleChallengeItem}"
                    CommandParameter="{{ item.Guid }}" />
            </Label.GestureRecognizers>
        </Label>
    </StackLayout>
{% endfor %}

Communication

This section refers to the 'Communication' mobile block group.

App registrations Azure AD portal screen.
Register an application configuration.
Add a permission button.
Select Microsoft Graph as the API.
The Add Optional Claim button.
Select the email, family_name & given_name claims.
The Rock Mobile configuration for Microsoft Entra.
The overview of an Entra app registration.
Configure the login block to show Entra.
Mark a block to expand
Completion Xaml
Completion Action
Completion Action
here
DailyChallenge
DailyChallenge
DailyChallenge
ChallengeState
ChallengeItem
ChallengeItemValue
ChallengeItemValue
ChallengeItemValues
DailyChallenge
DailyChallenge
DailyChallenge

Check-in

This section refers to the 'CMS' mobile block group.

Profile Details

Allows the user to edit their account on a mobile application.

This block is pretty self-explanatory. It can be used to edit the profile details of the currently logged-in individual.

Block Configuration

Connection Status

The connection status to use for new individuals. Defaults to Prospect.

Record Status

The record status to use for new individuals. Defaults to Pending.

Showing/Requiring Fields

In the Mobile Local Settings, each field follows a specific pattern. There is one setting for whether or not to show a field, and another that determines whether or not the field is required. If show is set to No, then the required field is irrelevant. This takes place for every field on that list, although the Gender field follows a newer style, the concept is the same (because it was added later).

Modifying Another Person Profile

In order to modify another person's profile, you must pass in the PersonGuid as a page parameter. Note that you must have access to make modifications.

Register

Allows the user to register a new account on a mobile application.

This block allows an individual to register for a new account. There are a number of options that control what information you collect and which bits are required.

Be careful about what information you require. Because of recent changes in both Apple and Google's app stores, it is getting more difficult to require personal information. You may have to argue with either Apple or Google (or both) for why you are requiring certain personal information to be entered.

Block Configuration

Person Matching

In order for person matching to work, there are a few things that must come together:

  1. Block Settings

    1. Check For Duplicates (Enabled by default)

    2. Confirmation Page (You must configure this)

    3. Confirm Account Template (Configured by default)

  2. Mobile Shell Version 3 or Later

  3. E-mail Address Provided by Individual

The first is, obviously, that you must turn on Check For Duplicates. This is the primary setting that dictates if the entire feature is enabled or not.

Once that is enabled, you also need to specify the Confirmation Page that the user will be sent to from their e-mail. This is a web page and not a mobile page, for example on your External Website you would select the "Support Pages > Account Confirmation" page.

Third, you must select the system e-mail that will be used as the template when generating the e-mail. This is selected by default.

In addition to the above block settings, there are two other things. First, as is pretty clear from the above, your users must be using version 3 or later of the Mobile Shell. This is because additional support was added in the shell to handle the UI to inform the user that the account was created but they need to confirm it. If an individual is running version 2 or below of the Mobile Shell then they will get the old behavior, which is no person matching.

Finally, they must provide an e-mail address. Because we need to send an e-mail when performing person matching the user must enter an e-mail address. This causes strict matching to be enabled in the search which means only people whose current, or previous, e-mail matches the one being searched for are considered for the duplicate search. Since adding a new user login to an existing person is a security-sensitive process, we need to be more strict about these things.

Using Auth0

Using Auth0 for your Rock mobile application login.

What is Auth0?

Auth0 is a cloud-based identity and access management (IAM) platform that provides developers and organizations with secure and easy-to-use solutions for authenticating and authorizing user access to applications. Auth0 offers a range of authentication methods such as username and password, social identity providers, multi-factor authentication, and more.

With Auth0, developers can add authentication and authorization capabilities to their applications quickly and easily. Check out their website to learn more about the services they offer.

Setup

To ensure Auth0 works seamlessly in Rock Mobile, follow this step-by-step guide to configure a new Auth0 application for Rock Mobile. In this guide, we will:

  1. Create and configure a new Auth0 application for Rock Mobile.

  2. Configure Auth0 to provide enough data for Rock sign-up.

  3. Configure Rock Mobile to support Auth0.

Rock requires a First Name, Last Name and either a valid Phone Number or Email to process external authentication. You should take steps to ensure that those specific data points are always returned from Auth0 authentication.

Creating an Auth0 Application

To begin, let's create the Auth0 application that will handle our Rock Mobile logins. You should only need one application for all of your mobile applications.

You cannot use the same application you've configured for Rock Web, since it requires settings specific to mobile authentication.

  1. Select Native as the type of application.

  2. Head into the Settings of the Application. You can ignore the Quick Start guide that they typically start you on. Note down the Client ID and Domain of your Auth0 application.

  1. Make sure you have your app's Bundle ID (iOS) and Package Name (android) available. If you are unsure of these values or where to retrieve them you should contact the AppFactory publishing service.

  2. In the Allowed Callback URLs of the Auth0 application, add an entry in the following format. If your package name and bundle identifier differ, you will require two URLs, one for each.

<Bundle Identifier/Package Name>://auth0/callback
  1. Under Credentials, ensure the Token Endpoint Authentication Method is set to None. Mobile apps use a different form of authentication in comparison to web applications.

Great! We should now have all of the basic configuration finished.

Getting Additional Data for Rock

In order to sign a person up, Rock requires a First Name, Last Name, and either a Phone Number or an Email. Auth0 does not require all of these data points out of the box. There are quite a few ways that you could customize the login flow to support this additional data, but we're going to keep it pretty straightforward in this guide.

To ensure all of the necessary data for Rock is obtained, we will:

  1. Configure Universal Login to add additional fields for database sign-up.

  2. (optional) Configure a post-login rule to pass additional information to Rock.

Configuring Universal Login

  1. First, we need to configure Auth0's Universal Login to ensure there is enough data collected to create a person in Rock. Head over to Branding > Universal Login > Advanced Options > Login. Enable the Customize Login Page option.

additionalSignUpFields: [{
    name: "given_name",
    placeholder: "Enter your first name",
    storage: "root" // IMPORTANT!
    {
    name: "family_name",
    placeholder: "Enter your last name",
    storage: "root" // IMPORTANT!
    },
    {
}]

The entire file looks like this if you want to copy and paste the entire example.

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
  <title>Sign In with Auth0</title>
  <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=0" />
</head>
<body>

  <!--[if IE 8]>
  <script src="//cdnjs.cloudflare.com/ajax/libs/ie8/0.2.5/ie8.js"></script>
  <![endif]-->

  <!--[if lte IE 9]>
  <script src="https://cdn.auth0.com/js/base64.js"></script>
  <script src="https://cdn.auth0.com/js/es5-shim.min.js"></script>
  <![endif]-->

  <script src="https://cdn.auth0.com/js/lock/11.32/lock.min.js"></script>
  <script>
    // Decode utf8 characters properly
    var config = JSON.parse(decodeURIComponent(escape(window.atob('@@config@@'))));
    config.extraParams = config.extraParams || {};
    var connection = config.connection;
    var prompt = config.prompt;
    var languageDictionary;
    var language;

    if (config.dict && config.dict.signin && config.dict.signin.title) {
      languageDictionary = { title: config.dict.signin.title };
    } else if (typeof config.dict === 'string') {
      language = config.dict;
    }
    var loginHint = config.extraParams.login_hint;
    var colors = config.colors || {};

    // Available Lock configuration options: https://auth0.com/docs/libraries/lock/v11/configuration
    var lock = new Auth0Lock(config.clientID, config.auth0Domain, {
      auth: {
        redirectUrl: config.callbackURL,
        responseType: (config.internalOptions || {}).response_type ||
          (config.callbackOnLocationHash ? 'token' : 'code'),
        params: config.internalOptions
      },
      configurationBaseUrl: config.clientConfigurationBaseUrl,
      overrides: {
        __tenant: config.auth0Tenant,
        __token_issuer: config.authorizationServer.issuer
      },
      assetsUrl:  config.assetsUrl,
      allowedConnections: connection ? [connection] : null,
      rememberLastLogin: !prompt,
      language: language,
      languageBaseUrl: config.languageBaseUrl,
      languageDictionary: languageDictionary,
      theme: {
        //logo:            'YOUR LOGO HERE',
        primaryColor:    colors.primary ? colors.primary : 'green'
      },
      prefill: loginHint ? { email: loginHint, username: loginHint } : null,
      closable: false,
      defaultADUsernameFromEmailPrefix: false,
    	additionalSignUpFields: [
    	{
        name: "given_name",
        placeholder: "Enter your first name",
        storage: "root" // IMPORTANT
    	},
     	{
        name: "family_name",
        placeholder: "Enter your last name",
        storage: "root" // IMPORTANT!
         },
	]
});

    if(colors.page_background) {
      var css = '.auth0-lock.auth0-lock .auth0-lock-overlay { background: ' +
                  colors.page_background +
                ' }';
      var style = document.createElement('style');

      style.appendChild(document.createTextNode(css));

      document.body.appendChild(style);
    }

    lock.show();
  </script>
</body>
</html>

Once finished, paste it into the HTML section into the box. Ensure the preview looks correct.

(optional) Pass in Additional Information to your Rock instance

There are a billion ways in which you can configure your Auth0 login process. You may want to enhance the process to return additional information to your Rock instance (such as Gender, BirthDate, etc).

 type: "select",
    name: "gender",
    placeholder: "choose your gender",
    options: [
      {value: "1", label: "Male"},
      {value: "2", label: "Female"},
      {value: "0", label: "Unspecified"}
      ],
    },
    {
    name: "phone_number",
    placeholder: "Phone Number"

This will add a Gender picker that reflects the Gender enum, and a basic Phone Number field.

  1. Jump into Action > Flows and press Login to configure a post-login flow. Select Build Custom.

  1. In onExecutePostLogin method, configure the identity claims to pass down the proper data, like such:

exports.onExecutePostLogin = async (event, api) => {
  var userPhoneNumber = event.user.phone_number ?? event.user.user_metadata?.phone_number;
  var userEmail = event.user.email ?? event.user.user_metadata?.email;

  var needsPhoneOrEmail = (userPhoneNumber && userPhoneNumber != "") || (userEmail && userEmail != "");

  if( needsPhoneOrEmail )
  {
    // Invalid login. Here you could customize the login flow to prompt the users for the values, if you wanted to.
  }

  if (event.authorization) {
    // We're careful here to only update the claims if they don't
    // already exist. These can be set previously be social providers, so 
    // if we have a value that's null it's likely it came from there,
    // and the claim is already set (so we don't need to reference metadata).
    if( userPhoneNumber )
    {
      api.idToken.setCustomClaim("phone", userPhoneNumber );
    }
    if( event.user.user_metadata?.gender )
    {
      api.idToken.setCustomClaim("gender", event.user.user_metadata?.gender );
    }
    if( event.user.user_metadata?.given_name )
    {
      api.idToken.setCustomClaim("given_name", event.user.user_metadata?.given_name );
    }
    if(  event.user.user_metadata?.family_name )
    {
      api.idToken.setCustomClaim("family_name", event.user.user_metadata?.family_name );
    }
  }
};

Press Deploy. The last thing we need to do is add it to the login flow. Add the Action you just created before the completion of the login, like such. Make sure to press Apply afterwards.

Configuring Rock Mobile

There are a couple of configuration steps for Rock Mobile.

  1. In your mobile application (Cms Configuration > Mobile Applications), look for the Auth0 Client ID and Auth0 Domain settings. Update them with your application values.

  2. Enable Auth Login in the Login block.

    Hooray! You should now be fully capable of handling Auth0-related logins.

Go into your login block, and press the Login With Auth0 button. That button has a btn-auth0 style class applied for customization. You should now be prompted with an Auth0 login.

In the Sign Up tab, you should see all of the additional fields you configured.

When you successfully log in with Auth0 (even for new accounts), a Person in Rock will be matched or created with the values of the Auth0 account.

Supported Claims

The following identity claims are supported and can be utilized to supply additional information about a Rock Person. Since Auth0 configurations can vary, we supply a few different keys that are recognized and translated accordingly.

Key(s)
Type
Value

firstname, first_name, given_name

string

The FirstName of the Person.

lastname, last_name, family_name

string

The LastName of the Person.

phone, phonenumber, phone_number

string

The PhoneNumber of the Person.

campus, campus_guid

Guid

The Guid of the Person campus.

photo, picure, profile_image, avatar

string

The source of the Person profile image.

nickname

string

The nickname of the Person.

birthday, birth_date, birthdate, date_of_birth

DateTime

TheDateTime representation of the Person date of birth.

gender

string

The Gender representation of the Person. Can be interpreted as the enum integer or corresponding string value.

Animations

Animations provide a way to make adjustments to the UI in response to user actions over a pre-determined amount of time.

Defining Animations

Let's talk about simple animations first. Animations are referenced by name and defined in the Resources of an element. In order to access an animation, it must be defined in an ancestor of where you are trying to reference it. Said another way, let's suppose you have the following XAML defined:

<ScrollView>
  <StackLayout>
    <Label x:Name="myLabel" Text="Hello Rock!" />
  </StackLayout>
</ScrollView>

If you wanted to apply an animation to the label called myLabel then you would need to define it on either the StackLayout or the ScrollView. As long as it's defined above the element you are going to be referencing it from then you are fine. You cannot define it on the element itself.

So let's take an example of what this might look like:

<ScrollView>
  <StackLayout>
    <StackLayout.Resources>
      <Rock:FadeToAnimation x:Key="FadeOut"
        Target="{x:Reference myLabel}"
        Duration="2000"
        Opacity="0" />
    </StackLayout.Resources>

    <Label x:Name="myLabel" Text="Hello Rock!" />
  </StackLayout>
</ScrollView>

This defines an animation that references myLabel as the target of the changes it will be making. The animation is going to be changing the Opacity property of the label over a duration of 2,000 milliseconds (2 seconds). Finally, it will change the opacity of the label from its current opacity to the target opacity of 0. Note, this only defines the animation, it doesn't actually trigger it.

These types of animation definitions let you target specific visual elements with a pre-defined animation style.

Starting Animations

Okay, we were able to define an animation but we need to start it somehow. You have two choices when it comes to triggering an animation.

  1. Trigger style in response to the user doing something.

  2. Automatically when the view loads (behavior style).

Let's modify our example above but include a trigger style activator based on the user tapping a button:

<ScrollView>
  <StackLayout>
    <StackLayout.Resources>
      <Rock:FadeToAnimation x:Key="FadeOut"
        Target="{x:Reference myLabel}"
        Duration="2000"
        Opacity="0" />
    </StackLayout.Resources>

    <Label x:Name="myLabel" Text="Hello Rock!" />

    <Button Text="Fade">
      <Button.Triggers>
        <EventTrigger Event="Clicked">
          <Rock:BeginAnimation Animation="{StaticResource FadeOut}" />
        </EventTrigger>
      </Button.Triggers>
    </Button>
  </StackLayout>
</ScrollView>

We've added a button and a BeginAnimation trigger to it that starts the FadeOut animation we previously defined. Now, when the user taps the Fade button, the label above will slowly fade out over 2 seconds.

Another way we could define this is by behavior. Suppose we wanted the text to automatically fade out after the page loads? To do that we would use a BeginAnimationBehavior instead:

<ScrollView>
  <StackLayout>
    <StackLayout.Resources>
      <Rock:FadeToAnimation x:Key="FadeOut"
        Target="{x:Reference myLabel}"
        Duration="2000"
        Opacity="0" />
    </StackLayout.Resources>

    <Label x:Name="myLabel" Text="Hello Rock!">
      <Label.Behaviors>
        <Rock:BeginAnimationBehavior Animation="{StaticResource FadeOut}" />
      </Label.Behaviors>
    </Label>
  </StackLayout>
</ScrollView>

The way behaviors work is that they begin when the element they are attached to are themselves attached to their parent element. Because there might be a delay between when this happens and when the page itself becomes fully visible, there is a hard-coded 250-millisecond delay before the referenced animation actually begins.

Stopping Animations

You can also provide the ability to stop an animation by using a trigger. Technically, the library also supports stopping an animation using a behavior, but in our use case, those don't actually make sense. If you are curious though, it is available as EndAnimationBehavior. But here is an example of two buttons, one to start and one to stop an animation.

<ScrollView>
  <StackLayout>
    <StackLayout.Resources>
      <Rock:FadeToAnimation x:Key="FadeOut"
        Target="{x:Reference myLabel}"
        Duration="2000"
        Opacity="0" />
    </StackLayout.Resources>

    <Label x:Name="myLabel" Text="Hello Rock!" />

    <Button Text="Start Fade">
      <Button.Triggers>
        <EventTrigger Event="Clicked">
          <Rock:BeginAnimation Animation="{StaticResource FadeOut}" />
        </EventTrigger>
      </Button.Triggers>
    </Button>

    <Button Text="Stop Fade">
      <Button.Triggers>
        <EventTrigger Event="Clicked">
          <Rock:EndAnimation Animation="{StaticResource FadeOut}" />
        </EventTrigger>
      </Button.Triggers>
    </Button>
  </StackLayout>
</ScrollView>

Triggered Animations

Triggered animations are ones that are, well, triggered by some user interaction. Until the user activates that trigger event, such as tapping a button, the animation remains idle.

All of the animations in this section support the following properties.

Property

Type

Description

Target

VisualElement

A reference to the targetted element to be animated.

Duration

string

The duration of the animation, in milliseconds. Defaults to 1000.

Easing

EasingType

The easing to use when calculating the animation curve: BounceIn, BounceOut, CubicIn, CubicInOut, CubicOut, Linear, SinIn, SinInOut, SinOut, SprintIn, SpringOut. Defaults to Linear.

Delay

int

A delay in milliseconds before the animation will begin. Defaults to 0.

RepeatForever

bool

Repeats the animation until stopped. Defaults to false.

BounceInAnimation

Animates the Scale and Opacity of the target to make it appear.

This animation ignores the Easing property.

<Rock:BounceInAnimation x:Key="Demo"
    Target="{x:Reference myLabel}"
    Duration="2000" />

BounceOutAnimation

Animates the Scale and Opacity of the target to make it disappear.

This animation ignores the Easing property.

<Rock:BounceOutAnimation x:Key="Demo"
    Target="{x:Reference myLabel}"
    Duration="2000" />

BackgroundColorAnimation

Animates the BackgroundColor of the target from its current value to a new color.

This animation ignores the Easing property.

Property

Type

Description

ToColor

Color

The target color that the BackgroundColor will be transitioned to.

<Rock:BackgroundColorAnimation x:Key="Demo"
    Target="{x:Reference myLabel}"
    Duration="2000"
    ToColor="#ee7725" />

ColorAnimation

Animates the specified property of the target, which must be of type Color, between two values.

Property

Type

Description

From

Color

The value that the property will be transitioned from. If not set then the current property value is used.

Property

string

The name of the property to be animated.

To

Color

The value that the property will be transitioned to.

<Rock:ColorAnimation x:Key="Demo"
    Target="{x:Reference myLabel}"
    Property="TextColor"
    Duration="2000"
    To="#ee7725" />

CornerRadiusAnimation

Animates the specified property of the target, which must be of type CornerRadius, between two values.

Property

Type

Description

From

CornerRadius

The value that the property will be transitioned from. If not set then the current property value is used.

Property

string

The name of the property to be animated.

To

CornerRadius

The value that the property will be transitioned to.

<Rock:CornerRadiusAnimation x:Key="Demo"
    Target="{x:Reference myBox}"
    Property="CornerRadius"
    Duration="2000"
    To="15,15,5,5" />

DoubleAnimation

Animates the specified property, which must be of type double, of the target between two values.

Property

Type

Description

From

double

The value that the property will be transitioned from. If not set then the current property value is used.

Property

string

The name of the property to be animated.

To

double

The value that the property will be transitioned to.

<Rock:DoubleAnimation x:Key="Demo"
    Target="{x:Reference myLabel}"
    Property="Opacity"
    Duration="2000"
    To="0.5" />

FadeInAnimation

Animates the Opacity and Y position of the element to make it visible. As the element is faded in it will also slide down or up to its final position.

This animation ignores the Easing property.

Property

Type

Description

Direction

string

The vertical movement direction of the element: Up or Down. Defaults to Up.

<Rock:FadeInAnimation x:Key="Demo"
    Target="{x:Reference myLabel}"
    Duration="2000"
    Direction="Down" />

FadeToAnimation

Animates the Opacity of the target from its current value to a new value.

Property

Type

Description

Opacity

double

The target opacity that the element should have once the animation finished. This value should be between 0 and 1.0.

<Rock:FadeToAnimation x:Key="Demo"
    Target="{x:Reference myLabel}"
    Duration="2000"
    Opacity="0.25" />

FadeOutAnimation

Animates the Opacity and Y position of the element to make it invisible. As the element is faded in, it will also slide down or up from its current position.

This animation ignores the Easing property.

Property

Type

Description

Direction

string

The vertical movement direction of the element: Up or Down. Defaults to Up.

<Rock:FadeOutAnimation x:Key="Demo"
    Target="{x:Reference myLabel}"
    Duration="2000"
    Direction="Down" />

FlipAnimation

Animates the Opacity and RotationY axis of the element to make it visible. As the element is faded in it will also rotate along its y-axis (that is, it will grow from a single vertical line to full-width) as if a card were being turned 90 degrees.

Check out the Flip View for an easy way to animate between two sections of content.

This animation ignores the Easing property.

Property

Type

Description

Direction

string

The horizontal rotation direction of the element: Left or Right. Defaults to Right.

<Rock:FlipAnimation x:Key="Demo"
    Target="{x:Reference myLabel}"
    Duration="2000"
    Direction="Left" />

HeartAnimation

Animates the Scale of the target to simulate a heartbeat, growing and shrinking slightly.

This animation ignores the Easing property.

<Rock:HeartAnimation x:Key="Demo"
    Target="{x:Reference myLabel}"
    Duration="1000" />

IntAnimation

Animates the specified property of the target, which must be of type int, between two values.

Property

Type

Description

From

int

The value that the property will be transitioned from. If not set then the current property value is used.

Property

string

The name of the property to be animated.

To

int

The value that the property will be transitioned to.

<Rock:IntAnimation x:Key="Demo"
    Target="{x:Reference myLabel}"
    Property="TabIndex"
    Duration="2000"
    To="12" />

JumpAnimation

Animates the TranslationY of the target to cause it to jump up and down.

This animation ignores the Easing property.

<Rock:JumpAnimation x:Key="Demo"
    Target="{x:Reference myLabel}"
    Duration="2000" />

RelRotateToAnimation

Animates the Rotation of the target to spin the element by the number of degrees. This rotation happens along the Z-axis, meaning it does not distort the element's perspective at all.

Property

Type

Description

Rotation

double

The delta angle that the target should be rotated by (positive or negative number).

<Rock:RelRotateToAnimation x:Key="Demo"
    Target="{x:Reference myLabel}"
    Duration="2000"
    Rotation="-45" />

RelScaleToAnimation

Animates the Scale of the target to make the element appear larger or smaller than it normally would.

Property

Type

Description

Scale

double

The delta amount that the target should be scaled by.

<Rock:RelScaleToAnimation x:Key="Demo"
    Target="{x:Reference myLabel}"
    Duration="2000"
    Scale="0.8" />

RotateToAnimation

Animates the Rotation of the target to spin the element to the specified final rotation value. This rotation happens along the Z-axis, meaning it does not distort the element's perspective at all.

Property

Type

Description

Rotation

double

The absolute angle that the target should be rotated to.

<Rock:RotateToAnimation x:Key="Demo"
    Target="{x:Reference myLabel}"
    Duration="2000"
    Rotation="180" />

RotateXToAnimation

Animates the RotationX of the target to shift the perspective of the element.

Property

Type

Description

Rotation

double

The absolute angle that the target should be rotated to.

<Rock:RotateXToAnimation x:Key="Demo"
    Target="{x:Reference myLabel}"
    Duration="2000"
    Rotation="90" />

RotateYToAnimation

Animates the RotationY of the target to shift the perspective of the element.

Property

Type

Description

Rotation

double

The absolute angle that the target should be rotated to.

<Rock:RotateYToAnimation x:Key="Demo"
    Target="{x:Reference myLabel}"
    Duration="2000"
    Rotation="90" />

ScaleToAnimation

Animates the Scale of the target to make the element appear larger or smaller than it normally would.

This animation ignores the RepeatForever property.

Property

Type

Description

Scale

double

The absolute value that the target should be scaled to, a value of 1 means normal scale.

<Rock:ScaleToAnimation x:Key="Demo"
    Target="{x:Reference myLabel}"
    Duration="2000"
    Scale="1.2" />

ShakeAnimation

Animates the TranslationX target to make it appear as if it were being shaken back and forth.

This animation ignores the Easing property.

<Rock:ShakeAnimation x:Key="Demo"
    Target="{x:Reference myLabel}"
    Duration="2000" />

ThicknessAnimation

Animates the specified property of the target, which must be of type Thickness, between two values.

Property

Type

Description

From

Thickness

The value that the property will be transitioned from. If not set then the current property value is used.

Property

string

The name of the property to be animated.

To

Thickness

The value that the property will be transitioned to.

<Rock:ThicknessAnimation x:Key="Demo"
    Target="{x:Reference myLabel}"
    Property="Margin"
    Duration="2000"
    To="15" />

TranslateToAnimation

Animates the TranslationX and TranslationY properties of the target to shift the element around from its normal position.

Property

Type

Description

TranslateX

double

The value that the element should be shifted to on the x-axis.

TranslateY

double

The value that the element should be shifted to on the y-axis.

<Rock:TranslateToAnimation x:Key="Demo"
    Target="{x:Reference myLabel}"
    Duration="2000"
    TranslateX="30"
    TranslateY="-15" />

TurnstileInAnimation

Animates the RotationY and Opacity properties of the target to give a turnstile effect to the element appearing on the screen.

This animation ignores the Easing property.

<Rock:TurnstileInAnimation x:Key="Demo"
    Target="{x:Reference myLabel}"
    Duration="2000" />

TurnstileOutAnimation

Animates the RotationY and Opacity properties of the target to give a turnstile effect to the element disappearing from the screen.

This animation ignores the Easing property.

<Rock:TurnstileOutAnimation x:Key="Demo"
    Target="{x:Reference myLabel}"
    Duration="2000" />

GroupAnimation

This special animation does not conform to the common properties mentioned previously. This element lets you group animations so that they can be triggered at the same time. Animations to be grouped together can be added as child elements.

When targeting the same element with multiple animations, they'll be played sequentially from top to bottom. The next animation will not start until the previous one has finished.

<Rock:GroupAnimation x:Key="FadeOut">
    <Rock:FadeToAnimation Target="{x:Reference myLabel}"
        Duration="2000"
        Opacity="0" />
    <Rock:FadeToAnimation Target="{x:Reference myButton}"
        Duration="2000"
        Opacity="0" />
</Rock:GroupAnimation>

Passive Animations

A passive animation is one that is always active and updates continuously whenever the property it uses to track progress changes. One example usage of this might be a slider that is used to specify the color of something. As the slider moves from one side to the other, the color slowly changes from one color to the other.

All of the animations in this section support the following properties.

Property

Type

Description

Property

string

The name of the property to be animated.

Progress

double

The current value being tracked.

Minimum

double

The minimum value to clamp Progress to. Defaults to 0.

Maximum

double

The maximum value to clamp Progress to. Defaults to 100.

Easing

EasingType

The easing to use when calculating the animation curve: BounceIn, BounceOut, CubicIn, CubicInOut, CubicOut, Linear, SinIn, SinInOut, SinOut, SprintIn, SpringOut. Defaults to Linear.

AnimateProgressColor

Animates the Color-type property between the From and To values.

Property

Type

Description

From

Color

The value to use when Progress is less than or equal to Minimum.

To

Color

The value to use when Progress is greater than or equal to Maximum.

<StackLayout>
  <Slider x:Name="mySlider"
    Minimum="0"
    Maximum="100" />

  <BoxView Color="Blue"
    HeightRequest="100">
    <BoxView.Behaviors>
      <Rock:AnimateProgressColor Property="Color"
        From="Red"
        To="Green"
        Progress="{Binding Path=Value, Source={x:Reference mySlider}}" />
    </BoxView.Behaviors>
  </BoxView>
</StackLayout>

AnimateProgressCornerRadius

Animates the CornerRadius-type property between the From and To values.

Property

Type

Description

From

CornerRadius

The value to use when Progress is less than or equal to Minimum.

To

CornerRadius

The value to use when Progress is greater than or equal to Maximum.

<StackLayout>
  <Slider x:Name="mySlider"
    Minimum="0"
    Maximum="100" />

  <BoxView Color="Blue"
    HeightRequest="100">
    <BoxView.Behaviors>
      <Rock:AnimateProgressCornerRadius Property="CornerRadius"
        From="15,15,5,5"
        To="5,5,15,15"
        Progress="{Binding Path=Value, Source={x:Reference mySlider}}" />
    </BoxView.Behaviors>
  </BoxView>
</StackLayout>

AnimateProgressDouble

Animates the double-type property between the From and To values.

Property

Type

Description

From

double

The value to use when Progress is less than or equal to Minimum.

To

double

The value to use when Progress is greater than or equal to Maximum.

<StackLayout>
  <Slider x:Name="mySlider"
    Minimum="0"
    Maximum="100" />

  <BoxView Color="Blue"
    HeightRequest="100">
    <BoxView.Behaviors>
      <Rock:AnimateProgressDouble Property="HeightRequest"
        From="25"
        To="200"
        Progress="{Binding Path=Value, Source={x:Reference mySlider}}" />
    </BoxView.Behaviors>
  </BoxView>
</StackLayout>

AnimateProgressInt

Animates the int-type property between the From and To values.

Property

Type

Description

From

int

The value to use when Progress is less than or equal to Minimum.

To

int

The value to use when Progress is greater than or equal to Maximum.

<StackLayout>
  <Slider x:Name="mySlider"
    Minimum="0"
    Maximum="100" />

  <BoxView Color="Blue"
    HeightRequest="100">
    <BoxView.Behaviors>
      <Rock:AnimateProgressInt Property="TabIndex"
        From="0"
        To="15"
        Progress="{Binding Path=Value, Source={x:Reference mySlider}}" />
    </BoxView.Behaviors>
  </BoxView>
</StackLayout>

AnimateProgressThickness

Animates the Thickness-type property between the From and To values.

Property

Type

Description

From

int

The value to use when Progress is less than or equal to Minimum.

To

int

The value to use when Progress is greater than or equal to Maximum.

<StackLayout>
  <Slider x:Name="mySlider"
    Minimum="0"
    Maximum="100" />

  <BoxView Color="Blue"
    HeightRequest="100">
    <BoxView.Behaviors>
      <Rock:AnimateProgressThickness Property="Margin"
        From="0"
        To="20,20,10,10"
        Progress="{Binding Path=Value, Source={x:Reference mySlider}}" />
    </BoxView.Behaviors>
  </BoxView>
</StackLayout>

Load Animations

EntranceTransition

Provides the animated transition behavior on controls when they first appear. You can use this on individual objects or on containers of objects. In the latter case, child elements will animate into view in sequence rather than all at the same time.

Property

Type

Description

Duration

int

The speed in milliseconds for which each child element is animated into view.

<StackLayout>
    <StackLayout.Behaviors>
    	 <Rock:EntranceTransition Duration="1000"/>
    </StackLayout.Behaviors>
    
    <Label Text="Title"
        StyleClass="h3" />
    
    <Rock:ContainedCard Image="https://yourserver.com/image-grandtetonfence.jpg"
        Tagline="DESTINATIONS"
        Title="Start Your Adventure">
        Bring to the table win-win survival strategies to ensure...
    </Rock:ContainedCard>
</StackLayout>
Note: Your menu might look different
The menu icon can be seen in the navbar on the left.
The Flyout panel can contain links, Login information, and more.

If you are building your app utilizing the orange/blue Rock Mobile application and would like to test Auth0, you should coordinate your efforts with the publishing service.

In the , create a new application.

Create an Auth0 application.
Select `Native` as the type of application.
Note down the Client ID and Domain of your Auth0 application.
Add Allowed Callback URLs for post-authentication.
Ensure Token Endpoint Authentication Method is set toNone.

Scroll down to the customizable HTML. This section will allow us to modify the sign-up page to request additional information. You can supply additionalSignUpFields to the main Lock object to set specific user data. In this tutorial, we'll be accepting an additional phone number, gender, and the individual's first and last name. You can view the to see more about what you can do with these fields.

This part of the tutorial utilizes an , which is not part of the free Auth0 plan. If you don't want or need to pass down custom fields such as Gender, feel free to skip to Configuring Rock Mobile.

This is supported through the use of . In short, identity claims are set during your authentication process to provide additional information about an authenticated individual. There are quite a few ways you can set these claims as well, mostly through Auth0 Rules or Actions.

Do you remember the additionalSignUpFields we configured ? Let's add some more fields to that.

Create a new Custom Action.
Custom action creation settings.
Auth0 Client ID and Domain mobile settings.
Login block settings.

Animations in Rock Mobile Shell are provided by the library. That page has some samples and screenshots to give you a few ideas of what you can build. But we'll give you some information on how to build it here.

App Factory
Auth0 Dashboard
Auth0 documentation
Auth0 Action
Identity Claims
Xamanimation
earlier

Connection

This section refers to the "Connection" mobile block group.

Chat View

Enables a full-featured real-time chat experience with support for threads, reactions, media, group messaging and more.

To get started with Chat in Rock, contact the AppFactory team to discuss the required pre-configuration for your mobile app.

Overview

The Chat View block brings a modern, real-time messaging experience to your Rock-powered app. Chat channels are automatically synced from your Rock groups, allowing users to communicate in group chats, direct messages, or community discussions — all based on their existing group memberships.

Features include:

  • Real-time messaging with typing indicators and read receipts

  • Support for threads, reactions, and media attachments

  • Direct messages and group chats tied to Rock group data

  • Push notifications

This block is ideal for fostering engagement in small groups, ministries, volunteer teams, or campus-wide discussions.

Page Parameters

Key
Type
Description

ChannelId

string

If provided, this will limit the block to the passed channel. This can be the Rock Group identifier (IdKey/Guid) or the direct channel cid.

SelectedChannelId

string

If provided, this will pre-select the block to the passed channel. This can be the Rock Group identifier (IdKey/Guid) or the direct channel cid.

MessageId

string

If provided, the block will scroll to the passed in message. This cannot be used independently of ChannelId or SelectedChannelId.

Block Settings

Filter Shared Channels by Campus

If enabled, the channel list will filter according to the current person's campus. Groups without a campus will not be filtered out according to this setting.

Minimum Age

The integer value of the minimum age required to view this block. If the person does not have a stored Birth Date, they will be prompted.

Age Verification Template

If a person does not have a birthdate, this is the template that will render above the input for the person to enter their birthdate.

Age Restriction Template

Communication List Subscribe

Allows the user to subscribe or unsubscribe from specific communication lists.

Block Configuration

Communication List Categories

Select the categories of the communication lists to display, or select none to show all that the user is authorized to view.

Show Description

If enabled then the description of the communication list will be shown.

Show Medium Preference

If enabled, a segment picker will be displayed for lists that the person is subscribed to in order to set their preferred communication type.

Show Push Notification as Medium Preference

If enabled, push notification will be displayed as an option for medium preference.

Filter Groups By Campus Context

If enabled, groups will be filtered by the current campus context. If a campus is not set on the communication list, then it will be displayed no matter what.

Always Include Subscribed Lists

When filtering by campus, you may want to display lists that the user is subscribed to regardless of the campus context. Enabling this will do just that.

Styling

Check-in

The Rock Mobile check-in experience.

Overview

At first glance, check-in seems simple—just a way for someone to say, "I'm here!" However, from a technical perspective, recording this data involves several requirements. To streamline the process, we've broken down these requirements and provided solutions to ensure the check-in block is as seamless as possible.

Block Configuration

Check-in Settings

Check-in Configuration

This is a required setting. The configuration template to use for this check-in block.

Kiosk

This is a required setting. The kiosk to associate this check-in process with. Necessary for things like location based check-in, etc.

Primary Areas

The areas directly associated with the check-in configuration, to make available to this block.

Secondary Areas

The areas not directly associated with the check-in configuration.

Mobile Settings

Loading Screen Template

The XAML content to display when the block is loading data.

Completion Screen Template

The XAML content to display when a check-in process successfully completes.

Login Screen Template

The XAML content to display when a user presses log-in. If no content is provided, the application Login page will be used.

Allow Add Family Member

Whether or not you should be able to add a new family member during the check-in process.

Add Person Attributes

The custom attribute fields to display when a family member is being added.

Page Parameters

Key
Type
Description

ConfigurationTemplateId

string

The IdKey or GUID for the configuration template to use for the check-in process.

AreaIds

List<string>

The IdKeys or GUID of the areas to limit this check-in process to. Comma-delimited.

LocationIds

List<string>

The IdKeys or GUIDs of the locations that are available for this check-in process. Comma-delimited.

KioskId

string

The IdKey or GUID of the kiosk associated with this check-in process.

SelfCheckIn

bool

Whether or not this check-in process is strictly tied to the logged in individual.

Data Requirements

Successful check-in requires a lot of data. The diagram below highlights the key information needed to have a complete check-in process:

If any required data is missing, the UI will prompt the user, potentially extending the check-in process. However, by providing more context through page parameters—such as using deep links, QR codes, or NFC tags—you can create a faster, more seamless experience.

Additionally, Rock intelligently fills in missing data where possible. For example, if only one applicable schedule exists for the selected Area, Group, and Location, that step is skipped automatically. This especially applies to schedule because you can't pass that one in through page parameters.

Providing Context

The more data you can give the check-in process, the better.

When navigating to the Check-in (through a deep link, or from anywhere) you can pass in the parameters like such:

<Button Text="Check-In"
    Command="{Binding PushPage}"
    CommandParameter="008c0d6f-349a-41c3-b482-fd8b363260eb?ConfigurationTemplateId=QN8mrQBVyn" />

The query string in this instance would tell the block which configuration to use, while expecting the block settings to fill in the remaining gaps.

Deep Linking

Let's say you wanted to provide an NFC token in the Bears Room that could be tapped to Check-In. Your deep link route would look something like:

https://mychurch.com/m/checkin/{ConfigurationId}/{AreaId}/{LocationId}/{KioskId}

Your NFC token would be encoded to something that looks like:

https://mychurch.com/m/checkin/QN8mrQBVyn/OX9mQWPQo8/yqMlAxmENZ/OX9mQWPQo8

Assuming that the AreaId, LocationId and KioskId are all the proper values for that schedule, if there is only one available person to check-in, you would likely be navigated directly to the success screen. You have successfully filled in most of the needed information for checking-in without the end-user knowing a thing. Magic!

Communication Entry

Allows you to send out Email/SMS communications to a group of recipients.

Setup

For this block to work correctly, you must pass in a valid EntitySetGuid page parameter. This will populate the list of recipients that receive the communication. The EntitySetType should be of Person.

You can generate these EntitySetGuid parameters auto-magically, using the Group Member List block.

Settings

Setting
Description

Enable Email

Enable 'Email' as a communication transport.

Enable SMS

Enable 'SMS' as a communication transport.

Show From Name

Show the 'From Name' field for the email communication transport.

Show Reply To

Show the 'Reply To' field for the email communication transport.

Show Parent Communication Toggle

Show the toggle that enables/disables parent communication. You can use this in accordance with the 'ForceSendToParents' parameter.

Is Bulk

Whether or not the communication should be flagged as bulk.

Allowed SMS Numbers

The system phone numbers that are available to use as the 'From Number' for SMS communication. If none are supplied, all of the numbers in the list are available.

Show Only Personal SMS Number

Only SMS numbers tied to the current individual will be shown. Those with ADMIN rights will see all SMS numbers.

Hide Personal SMS Number

Only SMS numbers that are not tied to an individual will be shown.

Person Profile Page

This page is navigated to from the list of recipients that the communication failed to send to. The page is pushed to with a PersonGuid and a GroupMemberGuid parameter, of the person that the communication failed to deliver to.

SMS Character Limit

The amount of characters to limit an SMS message to.

Show Additional Email Recipients

Whether or not the field should be enabled to show additional email recipients.

Page Parameters

This block supports many query strings that can be used to override the block settings. This allows you to set a default, then customize the experience for each individual based on something like the group role or other data from Rock.

Name
Type
Description

EntitySetGuid

Guid

The EntitySet that sets the recipients for the communication.

EnableSms

bool

Takes precedence over the 'Enable Sms' block setting. Use this to enable/disable the sending of an SMS communication.

EnableEmail

bool

Takes precedence over the 'Enable Email' block setting. Use this to enable/disable the sending of an Email communication.

FromEmail

string

The email to send the communication from. If none are supplied, the block will assume the email of the current person.

FromNumberGuid

Guid

The Guid of the System Phone Number to set this block to use. Note, that this number must be available to the block. You can see more information in the configuring phone numbers section.

MaxRecipients

int

ForceSendToParents

bool

If parent communication is enabled, this will force any communication to also be sent to the parents of any children in the recipients.

ShowFromName

bool

Whether or not to show the 'From Name' Email field.

ShowReplyTo

bool

Whether or not to show the 'Reply To' Email field.

IsBulk

bool

Takes precedence over the 'Is Bulk' block setting. Whether or not to set the communication as bulk or not.

ReplyTo

string

When provided (and Show Reply To is enabled), the "Reply To" value for an Email communication will be hard-coded to the provide value.

FromNumberGuid

Guid

The Guid of the system phone number to limit the SMS communication to (From Number). Note that this number must be available to the block.

Security (Approving Communications)

This block uses a unique security verb, named Approve. This security role determines if someone is allowed to instantly queue a communication, or if it must be submitted for approval beforehand. It is highly recommended to configure the security on this block, to ensure not anyone can send a communication to a large number of people.

Here is the security action configured to behave exactly the same as the web block:

Communication View

This block is simple to use, but it's important to understand its function. When authoring a new push communication, you may have seen the question for Open Action, which includes the options Link to Mobile Page and Show Details. This block handles the Show Details option.

If you've ever wanted to show additional information to someone after they tap a notification, you can! The content you enter into the Additional Details box will be shown in the app via this block. Start by creating a new page and adding the Communication View block. Next, you'll need to tell the app which page has this block so it knows where to direct people that tap on notifications. Under the Application tab, click Edit and select the page you created for Communication View Page.

SMS Conversation List

Manage your inbox of SMS Conversations.

Configuration

Allowed SMS Numbers

This setting allows you to designate which phone numbers are permitted as From numbers. If no numbers are selected, all numbers will be available.

Show Only Personal SMS Number

When this setting is turned on, only SMS numbers associated with the current person will display. Administrators, however, will be able to view all SMS numbers.

Hide Personal SMS Number

Enable this setting to only show SMS numbers that aren't linked to a specific person - essentially, numbers without an "Assigned To Person" value.

Show Conversations From Months Ago

Limits the conversations shown to those of X months ago or newer.

Max Conversations

The max number of conversations to show in the panel.

Database Timeout

The number of seconds to wait before reporting a database timeout.

Conversation Page

Person Search Stopped Typing Behavior Threshold

The amount of time to wait before executing the person search command, from the millisecond that the person stops typing.

Page Parameters

The following query string parameters are recognized and utilized by this block.

Styling

SMS Conversation

Manage an SMS message conversation with a modern UI.

Configuration

Snippet Type

The type of snippets that will be made available via the snippet keyboard button.

Message Count

The number of messages to be returned each time more messages are requested.

Database Timeout

The number of seconds to wait before reporting a database timeout.

Page Parameters

The following query string parameters are recognized and utilized by this block.

Styling

Message Bubbles

To style message bubbles, we introduced the following custom CSS classes.

You can target these elements by using the ^MessageBubble selector.

Connection Type List

Displays the list of connection types.

This block returns all connection types. Consider filtering by the IsActive property.

Block Configuration

Header Template

This is the content that is rendered above the lists of your requests. This allows you to put a logo, header, or do whatever you like to style the top of this component.

Type Template

This is the main template that is used to display the entire list of your connection types. You can fully customize this template using the entire list object to do whatever you like with it.

Merge Fields

In the opportunity template, you have access to these objects:

No Requests Content

You may have noticed in some other blocks, there is a block setting to provide content when there is nothing to display. Often seen as something like a:

We have decided to make this an even easier piece of the puzzle to set, by including it in the template itself. If you wish to customize this content, the piece you are looking for is:

Detail Page

This is the page that is linked when a specific request is selected. You can see it being used here in the default template.

Connection Opportunity List

Displays the list of connection opportunities for a single connection type.

Getting Content

Getting the connection types

In order for the block to know which 'Connection Type' to display opportunities for, you need to give it some context. Navigate to 'Admin Settings > Power Tools > SQL Command' and execute the following query:

If there are any connection types available, this will display a list containing their name and guid. Select and copy the guid of the specific connection type you are trying to display opportunities for. In this walkthrough, I will be using the 'Involvement' connection type guid.

Using query parameters

To provide the guid we just obtained to the block, we do so by providing it with 'query parameters', which are context passed to the block when the page containing this block is pushed. This block looks for the following query parameters:

Deploy, press that button, and voila! The block should display the list of connection opportunities for the specific type. So now you can see how to show the opportunities for one specific connection type... but that would rarely be the actual intended use case.

Header Template

This is the content that is rendered above the lists of your requests. This allows you to put a logo, header, or do whatever you like to style the top of this block.

Merge Fields

Merge fields are fields that are available to use within the template. So in the header template, you have access to these objects:

Opportunity Template

This is the main template that is used to display the entire list of your opportunities. You can fully customize this template using the entire list object to do whatever you like with it.

Merge Fields

In the opportunity template, you have access to these objects:

No Requests Content

You may have noticed in some other blocks there is a block setting to provide content when there is nothing to display. Often seen as something like a:

We have decided to make this an even easier piece of the puzzle to set, by including it in the template itself. If you wish to customize this content, the piece you are looking for is:

Detail Page

This is the page that is linked when a specific request is selected. You can see it being used here in the default template.

Auth0: Secure access for everyone. But not just anyone.Auth0

If a person is under the specified , this is the template that will be displayed.

This block heavily depends on an understanding of . If you are unfamiliar, please refer to the link referenced.

First and foremost, the block must be configured properly to function. Almost any block setting can alternatively be

Check-in Data Requirement Diagram

This block is relatively simple to use, but it requires a decent understanding of .

This doesn't limit the number of email recipients but is the maximum number before . The confirmation message on the final page will change to say the message has been submitted for approval.

Note that not every formatting option is supported in the mobile app, so don't go crazy with fonts and colors. Images are supported, and will generally try to adhere to the layout you set in the editor. For more info on what's supported, check out the .

The page that the person will be pushed to when selecting a conversation. It would be wise that this page include a block. This page will be pushed to with the PhoneNumberGuid and PersonGuid parameters.

Name
Type
Description

Name
Type
Description
Value
Type
Description

This block is used to display a list of the connection types. If you are unfamiliar with Connections in Rock, please refer to the .

Field
Type
Description

If you are lost, this is within the main for-loop of the , and by doing this, each opportunity passes its' individual Guid as a query string parameter for the detail page.

Pssst! This setting would be utilized as intended if it was set to a page that contained the block.

This block is used to display a list of connection opportunities for a single connection type. If you are unfamiliar with Connections in Rock, please refer to the .

Name
Type
Description

Conveniently, that is the same value we just obtained by . Create a new page that only contains a '' block. Provide the following as the content, but change pageGuidto represent the guid of the page you just created and the connectionTypeGuid to represent the guid that we got earlier.

If only there was some type of list to display all of the types for us... Oh, wait! There is. To fetch all of your connection types, create a new page with a '' block, and set the '' to a page containing this block.

Field
Type
Property
Field
Type
Description

If you are lost, this is within the main for-loop of the , and by doing this, each opportunity passes its individual Guid as a query string parameter for the detail page.

Psst! This setting would be utilized as intended if it was set to a page that had the block on it.

Communications in Rock
Communications in Rock
HTML control
Minimum Age
passed in as a page parameter.

AutoFocusPersonSearch

bool

A boolean indicating whether or not the Person Search field should be automatically focused upon display. Defaults to true.

PhoneNumberGuid

Guid

The Rock phone number that should be used for this conversation.

PersonGuid

Guid

The Guid of the Person to be communicated with.

-rock-inbound-background-color

Color

The color of the inbound messages background.

-rock-inbound-text-color

Color

The color of the inbound messages text.

-rock-outbound-background-color

Color

The color of the outbound messages background.

-rock-outbound-text-color

Color

The color of the outbound messages text.

^MessageBubble {
  -rock-inbound-background-color: orange;
}

ConnectionTypes

List<ConnectionType>

The entire list of the connection types.

ConnectionRequestCounts

Dictionary<int, Dictionary<string, object>>

A dictionary containing the total amount of requests for the type, and the amount of requests that are particular to you.

DetailPage

Guid

A Guid pertaining to the detail page that is navigated to when a connection type is clicked.

<NotificationBox Text="There are currently no connection types. Please check again later." />
{% if ConnectionTypes == empty %}
    ... Put your content here!
{% endif %}
{% if DetailPage != null %}            
    <Frame.GestureRecognizers>
        <TapGestureRecognizer Command="{Binding PushPage}" 
            CommandParameter="{{ DetailPage }}?ConnectionTypeGuid={{ type.Guid }}" />
    </Frame.GestureRecognizers>
{% endif %}
SELECT Name,Guid FROM [ConnectionType]

connectionTypeGuid

Guid

The guid of the type of connection you want to display opportunities for.

{% assign pageGuid = '' %}
{% assign connectionTypeGuid = 'dd565087-a4be-4943-b123-bf22777e8426' %}

<Button Command="{Binding PushPage}">
    <Button.CommandParameter>
        <Rock:PushPageParameters PageGuid="{{ pageGuid }}">
            <Rock:Parameter Name="connectionTypeGuid" Value="{{ connectionTypeGuid }}" />
        </Rock:PushPageParameters>
    </Button.CommandParameter>
</Button>

ConnectionType

ConnectionType

The connection type of the opportunity list.

ConnectionOpportunities

List<ConnectionOpportunity>

The entire list of the available opportunities.

ConnectionRequestCounts

Dictionary<int, Dictionary<string, object>>

A dictionary containing the total amount of requests for the type, and the amount of requests that are particular to you.

DetailPage

Guid

A Guid pertaining to the detail page that is navigated to when a connection opportunity is clicked.

<NotificationBox Text="You currently have no current requests. Please check again later." />
{% if ConnectionOpportunities == empty %}
    ... Put your content here!
{% endif %}
{% if DetailPage != null %}            
    <Frame.GestureRecognizers>
        <TapGestureRecognizer Command="{Binding PushPage}" 
            CommandParameter="{{ DetailPage }}?ConnectionOpportunityGuid={{ opportunity.Guid }}" />
    </Frame.GestureRecognizers>
{% endif %}
The SMS Conversation List CSS X-Ray
The SMS Conversations CSS X-Ray.
approval is required
SMS Conversation
connections manual
Connection Opportunity List
connections manual
Connection Request List
Type Template
Connection Type List
Detail Page
Content
getting the connection types
Opportunity Template
Logo

Add Connection Request

Allows a Person to create a new Connection.

Block Configuration

The only thing required for this block to function is the RequesterId. This can be the string IdKey or Guid of the Requester.

Connection Types

The connection types that will be made available to this block. If none are selected, all available connection types will be shown.

Post Save Action

The navigation command to execute after a save successfully occurs.

Post Cancel Action

The navigation command to execute when the "cancel" button is pressed.

Page Parameters

Key
Type
Description

RequesterId

string

The Id Key of the requester. Really the only "required" data point.

ConnectionTypeId

string

When provided, the connection type will be locked to this value and only display opportunities of its' own type.

ConnectionOpportunityId

string

When provided, the connection opportunity will be locked to this value. Must be accompanied with a ConnectionTypeId.

ConnectorId

string

When provided, the connector list will pre-select to this value. The field will not be locked.

Notes

Displays entity notes to the user and supports adding new notes or editing of existing notes.

Overview

In order to get content for our notes block, we need to do a couple of things. In this section, we will walk through the steps necessary to display notes of a specific entity by:

  1. Adding a note to a Person entity.

  2. Configuring the block settings.

  3. Configuring the context parameter.

  4. Passing in a GUID as a page parameter.

Adding a Note to an Entity

In order to get started, we need to make sure that we actually have a note to display. On your Rock server, navigate to a person's profile page (using the search in the top right is a fast and easy way) and press the add button to add a note. I would recommend adding a note to yourself, as you know that you will have permission to view it.

From here should be pretty self-explanatory. Go ahead and add a note with whatever text you wish, and press Save Note.

Configuration

The setting User Selectable must be enabled within the Note Type to save new notes.

Block Settings

Next, we need to configure our block to actually look for those personal notes. In the block settings, set the Entity Type to Person and in the Note Types, select Person: Personal Note.

So now, the block knows the entity type that we are fetching notes for, and also the specific note type we are fetching.

If enabled, a toggle will display that allows an individual to mark a Note as alert.

If enabled, a toggle will display that allows an individual to mark a Note as private.

Context Parameter

Next, we need to configure the page settings to look for a PersonGuid as a context parameter. We do this by heading to the page settings, which can be navigated to by pressing the Edit button above the mobile page builder.

Once in the page detail, underneath Advanced Settings, you should see a Context Parameters section. If you do not see this setting, please try refreshing the page and potentially clearing your cache. Set this to PersonGuid so the page knows that we are attempting to pass in a person guid as the context parameter.

Passing Context

  1. Navigate to our page containing the Notes block.

  2. Passes in the PersonGuid as a query string parameter.

For number one, we will need to obtain the PageGuid of the page containing our Notes block. Luckily, there is a handy feature that lets you do this easily. Press the little blue icon in the top right of your mobile page editor, as seen here:

Once obtained, go back to our blank page with nothing but the content block, and set the content to the following XAML:

Simply replace the pageGuid to the one you just copied, and you are good to go.

Launch the application, and tap the button we just created. You should see a similar outcome:

Keep in mind that you must be signed in to add a new note, otherwise the plus is hidden.

Using a Template

In many cases, you may want to incorporate Notes into another layout. That's why we introduced an option for you to customize the Notes block using your own XAML template.

To use a custom template, you must enable the Use Template block setting. When this setting is enabled, the Page Load Size becomes the amount of notes (ordered by recency) supplied to the template. It is recommended to keep this as a relatively low number. You can set a Note List Page block setting that is meant to direct to a page containing the Notes block in a full-screen manner (not using a template). The following commands and merge fields become available to you in the Notes Template:

If you are unfamiliar with Connections in Rock, please first refer to the .

Enable Group Notification

If enabled, the block will utilize the GroupContext of the page (use the command) as the group to notify when a note is added. Used in tandem with the .

Group Notification Communication Template

The communication template to use when a note is added and is true. Note will be passed in as a merge field to the communication template that you select.

Show Is Alert Toggle

Show Is Private Toggle

We're so close! For some of you, this should be easy peasy by now. But for those still getting started, let's go over quickly how to pass in the GUID as a query string parameter. Start by creating a new page with nothing but a block on it. For the content, we will supply a simple button that does two things.

The notes block is typically meant to be used as a full-screen block, with a layout that does not contain a ScrollView. This is due to the usage of a , which is a highly performant Xamarin Forms control that allows us to implement things like loading more notes as you continue scrolling down.

connections manual
{% assign pageGuid = 'your page guid' %}

<Button Text="Notes!" Command="{Binding PushPage}">
    <Button.CommandParameter>
        <Rock:PushPageParameters PageGuid="{{ pageGuid }}">
            <Rock:Parameter Name="PersonGuid" Value="{{ CurrentPerson.Guid }}" />
        </Rock:PushPageParameters>
    </Button.CommandParameter>
</Button>

Notes

List<Note>

The list of notes retrieved.

ListPage

Guid

The Guid of the Notes List Page to direct to from the "See All' button (in the standard template).

AddNote

Command

Displays a cover sheet with the functionality of adding a note.

EditNote

Command

Displays a cover sheet with the functionality of editing an existing note. Requires a NoteGuid command parameter.

Core

This section is in reference to the 'Core' mobile block group.

Content
CollectionView
Enable Group Notification

Attribute Values

Display and edit attribute values based on the provided category.

Block Configuration

Category

The attribute category to display the values of. Currently, this list shows all of the attribute categories. It is up to you to ensure that the selected Entity Type and Attribute are compatible.

Use Abbreviated Names

If true, and the attribute has an abbreviated name, that will be used in place of the attribute name.

Entity Type

The type of entity to fetch attributes for. This also becomes the Entity Type set as a context parameter.

Connection Request Detail

Displays the details of the given connection request for editing state, status, etc.

Style Classes

Block Configuration

Header Template

This is the content that is rendered above the lists of your requests. This allows you to put a logo, header, or do whatever you like to style the top of this block.

Merge Fields

Merge fields are fields that are available to use within the template. So in the header template, you have access to these objects:

Activity Template

This is the main template that is used to display the details of the request/activity. You can fully customize this template to style and provide the exact functionality you want.

Merge Fields

In the opportunity template, you have access to these objects:

No Activities Content

You may have noticed in some other blocks, there is a block setting to provide content when there is nothing to display. Often seen as something like a:

We have decided to make this an even easier piece of the puzzle to set, by including it in the template itself. If you wish to customize this content, the piece you are looking for is:

Page Settings

Person Profile Page

When the profile button is pressed, this is the page that will be pushed. Out of the box, the profile button provides the PersonGuid through a query string parameter upon navigating to this page.

Group Detail Page

When the group button is pressed, this is the page that will be pushed. The group button passes the GroupGuid through a query string parameter.

Workflow Page

When the workflow button is pressed, this is the page that will be pushed. This button passes the WorkflowGuid through a query string parameter.

Reminder Page

If supplied, a Reminder button will be shown that will display the selected page within a cover sheet.

Group Notification Communication Template

This block only allows edit of attributes with field types that are supported in the mobile shell. You can view the section to see which are currently supported.

This block is used to display details for a particular connection request. If you are unfamiliar with Connections in Rock, please refer to the .

Class
Element
Description
Field
Type
Property
Field
Type
Description

If this setting is left blank, the Profile action button will not be shown.

Supported Field Types

connection-request-detail-layout

Scroll View

Outer content wrapper

connection-request-detail-frame

Frame

Main content wrapper

connection-request-detail-content

StackLayout

Content within frame wrapper

status-pill-layout

FlexLayout

Pill content wrapper

contact-button-[xxx]

Button

[Name of action] (Ex: Mobile)

request-activities-frame

Frame

Wrapper around activities section

request-activities

StackLayout

Wrapper of activity content

add-activity-sheet

StackLayout

Wrapper of content in CoverSheet

activity-container

Grid

Individual activity wrapper

ConnectionRequest

ConnectionRequest

The specific connection request, as retrieved by the corresponding Guid.

ConnectionRequest

ConnectionRequest

The specific connection request, as retrieved by the corresponding Guid.

Activities

List<ConnectionRequestActivity>

A list of all the corresponding activities for the particular request.

<NotificationBox Text="There are no corresponding activities." />
{% if ConnectionOpportunities == empty %}
    ... Put your content here!
{% endif %}
connections manual

Search

Performs a search using one of the configured search components and displays the results.

Getting Started

A little bit of forewarning for when jumping into this block is that it has been pre-configured to function with the 'Person Name' search component. If you plan to change the component type, a decent understanding of XAML will have to be incorporated into the Result Item Template to use the ItemType.

The good news is that if that is the intended functionality, it works right out of the box, as long as you set the Search Component to Person Name.

Settings

Setting
Description

Search Component

The search component to use when performing searches. This item is passed into the template as the Item and ItemType merge fields.

Show Search Label

Determines if the input label for the search box should be displayed.

Search Label Text

The text within the search label. Note that if Show Search Label is set to No, this setting will be irrelevant.

Search Placeholder Text

The placeholder text within the search box.

Results Separator Content

Content to display between the search input and the results. This content will show with the display of the results.

Result Item Template

Content to display for each result item. The entity found in the search is passed in as the Item.

Content to display for each historical result item. Merge fields are populated by the parameters in the AppendToSearchHistory command.

Detail Navigation Action

The navigation action to perform when an item is tapped. The GUID of the item will be passed as the entity name and GUID, such as PersonGuid=value.

When enabled, will auto focus someone into the search field when the page is attached.

The amount of time in milliseconds for the user to stop typing to perform an auto-search. (0 to disable).

Styles

Class
Type

search-layout

Grid

search-frame

Frame

search-field-layout

Grid

search-icon

results-header

ContentView

search-loading-indicator

loading-more

results-collection-layout

Grid

results-layout-inner

CollectionView

results-layout

Frame

results-layout-inner

StackLayout

<StackLayout.GestureRecognizers>
    <TapGestureRecognizer Command="{Binding AppendSearchHistory}">
        <TapGestureRecognizer.CommandParameter>
            <!-- We should pass in the Guid (of the entity that we are saving)-->
            <Rock:AppendToSearchHistoryParameters Guid="{{ Item.Guid }}">
                <!-- These are parameters that become available as merge fields 
                to the Historical Result Item Template -->
                <Rock:Parameter Name="Name" Value="{{ itemName }}" />
            </Rock:AppendToSearchHistoryParameters>
        </TapGestureRecognizer.CommandParameter>
    </TapGestureRecognizer>
</StackLayout.GestureRecognizers>

These items then utilize the Historical Result Item Template, so you can save any related entity information to have full customization over your recent searches.

Smart Search

Allows you to offer search with multiple search components that an individual can switch between.

Supported Search Components

These are the only supported search components by the block. Using an unsupported search component will result in an error message to be displayed in place of search results.

Comonent
Entity Type
Description

Birthdate

Person

Search for a person by birthdate.

Name

Person

Search for a person by name.

Email

Person

Search for a person by email.

Address

Person

Search for a person by address.

Name

Group

Search for a group by name.

Block Configuration

The following options are available for configuration.

General Settings

The general settings for this block are as follows.

Search Component(s)

Select any number of the supported search components you would like to display as a search option.

Header Content

The content to be displayed above the search field. SearchComponent is available as a merge field. Lava is processed on the client.

Footer Content

The content to be displayed above the search field. SearchComponent is available as a merge field. Lava is processed on the client.

Result Size

The number of results to initially return and with each sequential load (as you scroll down).

Auto Focus Keyboard

Determines whether or not the keyboard should automatically open when the block comes into view.

Show Search History

Whether or not to display search history. This will be limited to "per-component".

Person Search Settings

These settings are specific to search components that return people.

Show Birthdate

Whether or not to display the Person's birthdate in the search result item.

Show Age

Whether or not to display the Person's age in the search result item.

Person Detail Page

The page to link to when a Person search result item is pressed.

Group Search Settings

These settings are specific to search components that return groups.

Group Detail Page

Group search only. The page to link to when a Group search result item is pressed.

Connection Request List

Displays the list of connection requests for a single opportunity.

Getting Content

  1. Navigate to the page containing the COL block, and tap!

Getting the connection opportunities

In order for the block to know which 'Connection Opportunity' to display requests for, you need to give it some context. Navigate to 'Admin Settings > Power Tools > SQL Command' and execute the following query:

SELECT Name,Guid FROM [ConnectionOpportunity]

If there are any connection opportunities available, this will display a list containing their name and guid. Select and copy the guid of the specific connection opportunity you are trying to display requests for. In this walkthrough, I will be using the 'Greeter' connection opportunity guid.

Using query parameters

To provide the guid we just obtained to the block, we do so by providing it with 'query parameters', which are context passed to the block when the page containing this block is pushed. This block looks for the following query parameters:

Name
Type
Description

connectionOpportunityGuid

Guid

The guid of the connection opportunity you want to display requests for.

{% assign pageGuid = 'c327bdc5-dc76-4408-baa4-c4a2d022ed36' %}
{% assign connectionOpportunityGuid = 'dd565087-a4be-4943-b123-bf22777e8426' %}

<Button Command="{Binding PushPage}">
    <Button.CommandParameter>
        <Rock:PushPageParameters PageGuid="{{ pageGuid }}">
            <Rock:Parameter Name="connectionTypeGuid" Value="{{ connectionOpportunityGuid }}" />
        </Rock:PushPageParameters>
    </Button.CommandParameter>
</Button>

Deploy, press that button, and voila! The block should display the list of connection opportunities for the specific type. So now you can see how to show the opportunities for one specific connection type... but that would rarely be the actual intended use case.

Block Configuration

Header Template

This is the content that is rendered above the lists of your requests. This allows you to put a logo, header, or do whatever you like to style the top of this block. Please note, that if a ConnectionOpportunity is not found, this content will not display.

Merge Fields

Merge fields are fields that are available to use within the template. So in the header template, you have access to these objects:

Field
Type
Property

ConnectionOpportunity

ConnectionOpportunity

The specific connection opportunity in reference.

Request Template

This is the main template that is used to display the entire list of connection requests. You can fully customize this template using the entire list object to do whatever you like with it.

Merge Fields

In the request template, you have access to these objects:

Field
Type
Description

ConnectionOpportunity

ConnectionOpportunity

The specific connection opportunity in reference.

ConnectionRequests

List<ConnectionRequest>

The entire list of the available requests.

DetailPage

Guid

The Guid used to reference the detail page.

No Requests Content

You may have noticed in some other blocks, there is a block setting to provide content when there is nothing to display. Often seen as something like a:

<NotificationBox Text="You currently have no current requests. Please check again later." />

We have decided to make this an even easier piece of the puzzle to set, by including it in the template itself. If you wish to customize this content, the piece you are looking for is:

{% if ConnectionRequests == empty %}
    ... Put your content here!
{% endif %}

Detail Page

This is the page that is linked when a specific request is selected. You can see it being used here in the default template.

{% if DetailPage != null %}            
    <Frame.GestureRecognizers>
        <TapGestureRecognizer Command="{Binding PushPage}" 
            CommandParameter="{{ DetailPage }}?ConnectionRequestGuid={{ request.Guid }}" />
    </Frame.GestureRecognizers>
{% endif %}

Historical Result Item Template

Auto Focus Keyboard

Stopped Typing Behavior Threshold

Utilizing Search History

You can utilize certain block settings to display a 'recently searched for' view that displays when the search field is empty. This is done through a combination of a few things, with the first being the AppendToSearchHistory command. This command is available on the . This command saves specific information about the entity to the shell.

This block does not provide a XAML template option and can only be styled with CSS. If you need a highly customizable search option, you should consider using the .

This block is used to display a list of connection requests for a single connection opportunity. If you are unfamiliar with Connections in Rock, please refer to the .

To summarize, this block looks for the connectionOpportunityGuid as a upon loading. You can provide this specifically (demonstrated below), or by following these steps below:

Create another page that contains a (COL) block.

Set the '' setting within the COL block to a page that contains this block.

Conveniently, that is the same value we just obtained by . Create a new page that only contains a '' block. Provide the following as the content, but change pageGuid to represent the guid of the page you just created and the connectionOpportunityGuid to represent the guid that we got earlier.

If only there was some type of list to display all of the opportunities for us... Oh, wait! There is. To fetch all of your connection opportunities, create a new page with a '' block, and set the '' to a page containing this block.

If you are lost, this is within the main for-loop of the , and by doing this, each opportunity passes its' individual Guid as a query string parameter for the detail page.

Psst! This setting would be utilized as intended if it was set to a page that had the block on it.

Search V1 block
connections manual
Connection Opportunity List
Connection Request Detail
Result Item Template
query string parameter
Content
getting the connection opportunites
Request Template
Detail Page
Connection Opportunity List
Detail Page
Icon
Activity Indicator
Activity Indicator

Quick Note

Minimally and easily jot down a note that is not tied to any specific entity.

This block allows you to quickly create a note from anywhere in your application. This note will not be tied to anything specific -- and has a default Note Type of Quick Note. You can use the My Notes block to later view and comprehensively manage the note.

Block Configuration

Note Type

The note type to use for the newly created Quick Note.

Placeholder Text

The text to use as the placeholder for the quick note.

My Notes

View and comprehensively manage any note you have created.

Recommended Layout

This block applies integrated scroll and internal padding. The recommended layout for this block is a simple, clean layout that lets the block do most of the work:

<?xml version="1.0" encoding="utf-8" ?>
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             xmlns:Rock="clr-namespace:Rock.Mobile.Cms;assembly=Rock.Mobile"
             xmlns:Common="clr-namespace:Rock.Mobile.Common;assembly=Rock.Mobile.Common">
            <Rock:Zone ZoneName="Main" />
</ContentPage>

Block Configuration

Note Item Template

This template is pretty complicated. It is what is displayed for each note item in the list. There are a handful of merge fields and commands that you can use to customize this template.

Merge Fields

Property
Description

Note

PersonEntityTypeId

The ID of the system Person entity type.

PersonAliasEntityTypeId

The ID of the system Person Alias entity type.

PersonAliasEntityTypeGuid

The GUID of the system Person Alias entity type.

ReminderEntityTypeId

The ID of the system Reminder entity type.

ConnectionEntityTypeId

The ID of the system Connection Request entity type.

ReminderNoteTypeGuid

The GUID of the configured Reminder Note Type (to use for new reminders).

ConnectionNoteTypeGuid

The GUID of the configured Connection Request Note Type (to use for new connections).

PersonDetailPage

The GUID of the configured person detail page.

ReminderDetailPage

The GUID of the configured reminder detail page.

ConnectionDetailPage

The GUID of the configured Connection Request detail page.

AddConnectionPage

The GUID of the configured Add Connection Page.

GroupNotesByDate

Whether or not you have configured this block to group the notes by the date they were left.

Commands

Command

DeleteNote

Triggers a deletion of the note. If this note has a linked reminder or connection, it will prompt the individual to ask if they want to delete the note or both the note and linked entity.

ShowNoteDetail

Pushes to an edit view of the note.

EditNote

Shows a cover sheet allowing someone to edit a note.

LinkToPerson

Shows UI to link the note to a person. Only works on notes that are not currently linked to an entity.

Enable Swipe for Options

If enabled, the note will be both left and right swipe-able with options to add a reminder, connection, link to person, edit or delete.

Person Note Types

The note types to allow when linking a note to a person. If none are checked, all of the note types will be included.

Reminder Note Type

The note type to update the note to when adding a reminder from the note.

Connection Note Type

The note type to update the note to when adding a connection request from the note.

Person Profile Detail Page

The page to use to view the details of a person.

Reminder Detail Page

The page to use to edit or add a reminder.

Add Connection Page

The page to use when adding a new connection from the note.

Connection Detail Page

The page to use when viewing the details of a connection request.

Group Notes by Date

Whether or not the notes should be grouped by the date they were left.

Note Items

Property
Type
Description

Id

int

The ID of the Note.

Guid

Guid

The GUID of the note.

EntityId

int

The ID of the entity associated with this note.

EntityGuid

Guid

The GUID of the entity associated with this note.

NoteTypeId

int

The ID of the note type.

NoteTypeGuid

Guid

The GUID of the note type.

NoteTypeEntityTypeId

int

The ID of the Entity Type associated with the Note Type.

EntityName

string

The friendly name of the linked entity.

NoteText

string

The text of the note.

NoteDate

DateTime

The date that the note was created.

NoteTypeName

string

The friendly name of the Note Type.

PhotoUrl

string

If this is a person note, this value will be the PhotoUrl of the person.

IsPrivateNote

bool

Whether or not this note is private.

IsAlert

bool

Whether or not this is an alert note.

A custom object containing useful information about the note. You can all of the properties available .

The Note item you have access to in the has the following properties available to you.

Note Item Template

Events

This section refers to the 'Events' mobile block group.

here

CRM

Group Members

Allows you to view the other members of a group person belongs to (e.g. Family groups).

Getting Started

This block is pretty straightforward to get working. The only thing really required is a Person context, which can be configured through the page settings.

Block Settings

Members Template

This is the template that will be used to display the members.

Merge Fields

The members template gets supplied the following merge fields.

Field
Type
Description

Groups

A list of an object containing a Group and CanEdit field.

This is an anonymous object that contains the Rock.Model.Group & a CanEdit boolean value that depicts whether or not the CurrentPerson has authorization to edit the Person retrieved from context.

Person

Rock.Model.Person

The person retrieved from context.

EditPage

Guid

Group Type

The group type to display members for. Defaults to Family.

Auto Create Group

If enabled, a new Rock.Model.Group will be created for the Person retrieved from context if it does not already exist.

Group Edit Page

Person Profile

Display and edit information about a Person.

Getting Started

This block is pretty straightforward to get working. The only thing really required is a Person context, which can be configured through the page settings.

Block Configuration

Phone Types

The phone number types to display.

Header Template

The template that displays at the very top of the block.

Commands

The header template has access to the following specialized commands.

Command
Parameter Type
Description

ShowEdit

n/a

If allowed (through security authorization checks), displays a cover sheet containing the Person Profile edit information.

Merge Fields

The header template gets supplied the following merge fields.

Field
Type
Description

Person

Rock.Model.Person

The Person retrieved from context.

CanEdit

bool

A value depicting whether or not the CurrentPerson has authorization to edit the Person retrieved from context.

Custom Actions Template

The template that displays underneath the contact buttons supplied by the block.

Merge Fields

Field
Type
Description

Person

Rock.Model.Person

The Person retrieved from context.

Badge Bar Template

Merge Fields

Field
Type
Description

Person

Rock.Model.Person

The Person retrieved from context.

Show Demographics Panel

A boolean value depicting whether or not the demographics panel should be shown.

Show Contact Information Panel

A boolean value depicting whether or not the contact information panel should be shown.

Reminder Page

If selected (and there is a valid reminder type), a 'Reminder' button will be shown that shows this page in a cover sheet.

Not to be confused with the block, this block displays the other members that belong to the same Group Type supplied through block configuration, for the Person retrieved from context. The main use-case for this block is to display a Person's family members.

Navigate to Mobile Applications > Person Profile Page > Edit.
Under Advanced Settings, set the Person Parameter Name of the Context Parameters.

This merge field is supplied from the block setting.

The page to push to when a group is selected. Exposed in the through a merge field.

Navigate to Mobile Applications > Person Profile Page > Edit.
Under Advanced Settings, set the Person Parameter Name of the Context Parameters.

The template that displays underneath the .

Group Member List
Members Template
Custom Actions Template
Group Edit Page

Calendar Event List

Displays a list of events from a calendar.

Parameters

Name
Type
Description

CampusGuid

Guid

An optional Guid of the campus to filter the events list to.

Settings

Calendar

The calendar to pull events from.

Detail Page

The mobile page to push onto the navigation stack when viewing details of an event. This will not work with an external web page.

Event Template

The template to use when rendering event items.

Merge Fields

In the template, you have access to these objects:

Field
Type
Description

Items

List<EventItemDetails>

The entire list of occurrence items.

Day Header Template

The XAML to use when rendering the day header above a grouping of events.

Enable Campus Filtering

If enabled then events will be filtered by campus to the campus context of the page and user.

Show Past Events

When enabled past events will be included on the calendar, otherwise, only future events will be shown.

Styling

Live Experience Occurrences

Displays a set of interactive experience occurrences to an individual.

Configuration

Destination Page

Login Page

The page to use when showing the login page. If not set, then the Login page provided in the Application settings will be used.

Show All

This should really only be used for testing, and hidden from public view. When enabled, all active occurrences will be shown.

Always Request Location

When enabled, the device location will always be requested. If disabled, then the location will only be requested dependent on whether or not the person has already been requested in the past.

Template

The template to use when rendering the content.

Merge Fields

The following merge fields are available to you in the template.

Key
Type
Value

Occurrences

List<InteractiveExperienceOccurrence>

A list of interactive experience occurrences that are available.

LoginRecommended

bool

If there are occurrences that require a logged in person, this will be true, so you may show a login button in the content.

GeolocationRecommended

bool

If there are occurrences that are tied to a location, this will be true, so you may show a login button in the content.

Refresh Interval

When assigned a value more than 0, the block will self-refresh at regular intervals, specifically every Refresh Interval seconds, but only if the block is visible on the page. It's generally advised not to set the value under 60 (with the exception of 0, which deactivates it).

The page to link to when selecting an occurrence. This should typically pass a InteractiveExperienceOccurrenceKey to a block.

Live Experience

Live Experience

Interact with an event in real time.

Configuration

Live Experience Web Page

Always Request Location

If enabled, the location will always be requested. If not, the OS will only prompt them for location dependent on whether or not they have been asked.

Keep Screen On

If enabled, the screen display will be marked to keep active while a Person is active in a Live Experience.

Page Parameters

Name
Description

InteractiveExperienceOccurrenceKey

The Guid or the Id Key of the Interactive Experience Occurrence to join.

The web page that will be displayed in a specialized for Live Experience. This web page should contain a Live Experience block.

WebView

Calendar Event Item Occurrence View

Displays a particular calendar event item occurrence.

This block displays a specific event item occurrence.

Page Parameters

The block looks for the following page parameter.

Name
Type
Description

EventOccurrenceGuid

Guid

The guid of the particular event occurrence.

Block Configuration

Registration URL

The base URL to use when linking to the registration page.

Template

The template to use when rendering the event.

Merge Fields

In the template, you have access to these objects:

Field
Type
Description

RegistrationUrl

string

EventItemOccurrence

EventItemOccurrence

The specific occurrence and the details of it.

Event

EventItem

The entire list of last prayed details.

CurrentPerson

Person

The current person.

Merge Field Types

This merge field has a couple of unique types, EventItemOccurrence and Event. Here are their usable properties.

EventItemOccurrence

Property
Type
Description

EventItemId

int

The event item identifier.

CampusId

int?

The campus identifier (optional).

Location

string

The description of the location.

ScheduleId

int?

The schedule identifier (optional)

ContactPersonAliasId

int?

The contact person alias Id.

ContactPhone

string

A string containing the contact person's phone number.

ContactEmail

string

A string containing the contact person's email.

Note

string

The campus note.

NextStartDateTime

DateTime

The next occurrence datetime (optional).

EventItem

Property
Type
Description

Name

string

The name of the event.

Summary

string

A summary of the EventItem.

Description

string

The description of the EventItem.

PhotoId

int?

The identifier for the photo. (optional)

DetailsUrl

string

Gets or sets the details for an external event.

IsActive

bool

Whether or not the EventItem is active.

IsApproved

bool

Whether or not the EventItem is approved.

ApprovedByPersonAliasId

int?

If approved, the Id of the person that approved it (optional).

ApprovedOnDateTime

DateTime

If approved, the DateTime that it was approved. (optional).

Finance

This section refers to the 'Finance' mobile block group.

Registration URL

Giving

The block used to provide a native giving experience.

To use platform payments (such as Apple or Google Pay), you will need to wait until you have coordinated publication with App Factory before this feature can be functional.

Overview

Native giving is here! Starting with Mobile Shell V7, contributions can be processed using native payment methods like Apple Pay and Google Pay—even without logging in. Individuals can also use their saved accounts in Rock or easily add new payment methods using a convenient card scanning feature. Scheduled transactions are fully supported.

This polished experience has been crafted with great attention to detail, featuring smooth animations, an intuitive user interface, and more.

Prerequisites

General

  1. The MyWell Gateway plugin.

Apple Pay

  1. A Benevity account.

  2. A merchant identifier.

  3. Apple Pay to be configured in the MyWell settings.

Google Pay

  1. Screenshots depicting the giving process (come submission time).

Block Configuration

Due to the number of settings, we placed this in expandable content below.

Block Settings

Enable ACH

Determines whether the block allows individuals to add ACH payment methods, such as bank accounts, and process transactions using those methods.

Enable Credit Card

Controls whether the block supports the use of credit and debit cards for payments. When enabled, individuals can enter add card payment methods and use them to complete transactions. This is enabled by default.

Enable Fee Coverage

Determines if the block offers individuals the option to cover transaction processing fees. When this feature is enabled, individuals can choose to add a percentage-based or fixed fee to their payment to offset processing costs (configured in the gateway).

Accounts

Specifies the list of financial accounts available for giving within the block.

Enable Multi-Account

Allows individuals to allocate their contributions across multiple financial accounts by specifying amounts for each account. This feature is enabled by default.

Scheduled Transactions

Determines whether the block provides an option for individuals to set up recurring (scheduled) transactions.

Transaction List Page

Defines the page to which individuals are redirected when they wish to view a history of their completed transactions. This is typically a page showing a list of financial transactions.

Scheduled Transaction List Page

Defines the page to which individuals are redirected to manage or review their scheduled transactions (recurring giving).

Saved Account List Page

Specifies the page where individuals can view and manage their saved payment methods, such as credit cards or bank accounts.

Connection Status

Specifies the default connection status (e.g., "Prospect") to assign to new individuals created during the giving process.

Record Status

Determines the default record status (e.g., "Pending") assigned to new individuals created by this block.

Address Type

Defines the location type (e.g., "Home") used for saving the address information of new individuals.

Ask for Campus if Known

Controls whether the campus field is displayed for individuals whose campus is already known to the system.

Include Inactive Campuses

Determines if inactive campuses are displayed in the campus selection dropdown.

Campus Types

Filters the available campuses by specific types (e.g., "Main Campus" or "Online Campus").

Campus Statuses

Filters the available campuses by their statuses (e.g., "Active" or "Inactive").

Use Account Campus Mapping Logic

When enabled, determines account selection based on campus associations, with specific logic applied for child accounts and campuses.

Receipt Email

Specifies the system email template used to send receipts for successful transactions.

Success Template

Provides the customizable template, written in Lava, to display a confirmation message upon successful transaction completion.

Transaction Type

Indicates the type of financial transaction processed by the block (e.g., "Contribution"). Defaults to the "Contribution" transaction type.

Batch Name Prefix

Defines the prefix for naming financial batches created by transactions processed in this block. Defaults to "Online Giving."

Account Campus Context

Configures filtering options for the accounts list based on campus context.

Styling

This block has internal scroll mechanics and built-in padding. It should be placed in a layout with no scrollable container and no external padding applied.

Calendar View

Displays a calendar of events.

Query Strings

Description

CampusGuid

GUID

Sets the campus context.

If the campus context is not set by query string, the local context from the Campus Context Picker will be used. If that doesn't have a value and the individual is signed in, the campus associated with their account will be used instead.

Merge Fields

In the template, you have access to these objects:

Field
Type
Description

Items

List<EventItemOccurrenceDetail>

A list of details pertaining to the calendar event.

Styling

Scheduled Transaction List

Displays a list of scheduled transactions.

Block Configuration

Template

The XAML template to display your scheduled transaction list with.

Include Inactive

Choose whether to include inactive scheduled transactions in the list.

Detail Page

The page will display the Giving Block when selecting a one of the scheduled transactions.

Accounts

Filter the list of scheduled transactions by the associated accounts.

Merge Fields

Event Item Occurrence List By Audience Lava

Block that takes an audience and displays calendar item occurrences for it using Lava.

Query Parameters

The query parameters this block looks for upon initialization are as follows.

Block Configuration

List Title

The title to make available in the lava.

Audience

The audience to show calendar items for.

Calendar

Filters the events by a specific calendar.

Campuses

List of which campuses to show occurrences for. This setting will be ignored if Use Campus Context is enabled.

Use Campus Context

Determine if the campus should be read from the campus context of the page.

Date Range

Optional date range to filter the occurrences on.

Max Occurrences

The maximum number of occurrences to show.

Event Detail Page

The page to use for showing event details.

Lava Template

The template to use when rendering event items.

Merge Fields

In the template, you have access to these objects:

Enabled Lava Commands

The Lava commands that should be enabled for this block, only affects Lava rendered on the server.

The Rock Mobile Giving experience is only compatible with the gateway.

Property
Type
Description
Name
Type
Description
Field
Type
Description
MyWell

DetailPage

Guid

The page selected in the Detail Page Setting.

ScheduledTransactionInfo

FinancialScheduledTransaction

The info about the scheduled transaction.

FrequencyText

string

Representing the payment frequency associated with the scheduled transaction.

CampusGuid

Guid

An optional Guid of the campus to filter event items to.

CurrentPage

Page

The current page of the individual.

ListTitle

string

The title of the list.

EventDetailPage

Guid

The Guid of the event detail page to navigate to.

EventItemOccurrences

List<EventItem>

A list of all event item occurrences.

FilteredCampuses

List<Campus>

A list of campuses based on the filters provided in the page parameter.

Audience

Audience

The audience to display events for.

Calendar

Calendar

The event calendar to display.

Structured Content View

Displays a structured content channel item for the user to view and fill out.

This block displays structured content from Rock in the app. You can use this to display interactive sermon notes with tap-to-reveal areas and note-taking areas.

Block Settings

Name
Description

The XAML content to render when there is no document found. Leave blank to render nothing.

Content Channel

You'll see a channel called "Message Notes" that comes out of the box with Rock, so you typically won't need to set this up manually unless you have another purpose in mind. When editing a content channel, you can check the Is Structured Content option to enable this functionality. This will change the Default Content Control option to Editor Tool Configuration.

Adding new child items to this content channel will allow you to edit the structured content with a rich editor. Check out the Supported Formatting section to see what's available. In order to link this note item to a Message, simply add it as a child to the content channel item for the Message.

Mobile App

In the app, you'll need a page with the Structured Content View block added. Thankfully there aren't any block settings to worry about, so you'll just need to add a link to this page that passes context using the ItemGuid query string with a value of the content channel item GUID. In the case of Message Notes, you can use Lava to look at the ChildItems of a message to get the Notes/Structured Content item.

<!-- Set the content channel type Guid of Message Notes -->
{% assign typeGuid = '48951e97-0e45-4494-b87c-4eb9fca067eb' %}

{% assign noteItem = '' %}
{% for childItem in Item.ChildItems %}
    
    <!-- Skip any child items that are not of type Message Notes -->
    {% if childItem.ChildContentChannelItem.ContentChannelType.Guid == typeGuid %}
        
        <!-- Assign the note and skip the remaining child items -->
        {% assign noteItem = childItem.ChildContentChannelItem %}
        {% break %}
    {% endif %}
{% endfor %}

{% if noteItem != '' %}
    {% assign noteGuid = noteItem.Guid %}
    <Button Text="Message Notes"
        Command="{Binding PushPage}"
        CommandParameter="{{ yourMessageNotesPageGuid }}?ItemGuid={{ noteGuid }}" />
{% endif %}

Supported Formatting

Not all formatting options are supported natively in the app, but here's what can be used safely:

  1. Text

  2. Heading

  3. List (ordered and unordered)

  4. Image

    1. Image captions

  5. Checklist

  6. Quote

    1. Left-aligned

    2. Center-aligned (stays aligned left)

  7. Warning

  8. Code

  9. Note (can be left blank or default content entered)

  10. Delimiter

  11. Link

  12. Table

When highlighting text, the following formatting is supported:

  1. Bold (depending on font support)

  2. Italic (depending on font support)

  3. Link

  4. Marker

  5. Fill-in

  6. Code

Notes

When using note blocks in structured content, they will only display if a user is logged in. We recommend putting a content block above this one that only displays if a user is not logged in, and prompts them to log in or at least lets them know that the notes are missing until they do so.

Document Not Found Content

Groups

This section is in reference to the 'Groups' mobile block group.

Transaction Detail

Display the detail of the transaction.

This block allows you to view the detail of the transaction that you made.

Page Parameter

This block checks for the following page parameter.

Name
Type
Definition

Transaction

string

The identifier of the transaction (IdKey or Guid).

Styling

Transaction List

Displays a list of transactions.

Block Configuration

Past Years Filter Limit

The maximum number of past years a user can filter when viewing transaction history.

Detail Page

Page to link to when user taps on a Transaction List. Detail Page GUID is passed in the query string.

Give Now Action

When no result is shown how should the 'Give Now' button behave.

Styling

Group Attendance Entry

Unlike the web, groups must have a schedule configured in order to use this block.

Parameters

Name
Type
Description

GroupGuid

Guid

The guid of the group you wish to mark attendance for.

Settings

Property
Description

Number of Days Forward to Allow

The number of days forward to allow attendance to be entered for.

Number of Days Back to Allow

The number of days back to allow attendance to be entered for.

Save Redirect Page

When the 'Save' button is pressed, this is the page that is navigated back to. If Show Save Button is disabled, this will be irrelevant.

Show Save Button

Whether or not you want to display the save button.

Allow Any Date Selection

Whether or not any custom date can be selected.

Show Attendance Notes

Whether or not the text field for note entry will be visible.

Attendance Note Label

The attendance label that appears above the notes field. If Show Attendance Notes is disabled, this will be irrelevant.

Styles

Class
Element
Description

group-attendance-entry-layout

StackLayout

Outer content wrapper

header

ContentView

Header content wrapper

divider

Applies to all dividers

notes

The conditional notes editor

save-button

The conditional save button

This block displays a list of group members that can be selected to mark attendance for a specified date. You can read more about group attendance here in the .

Rock Your Groups manual
Divider
Text Editor
Button

Group Edit

This is a block that allows you to edit specific details and attributes about a particular group.

Getting Content

Page parameters

The parameters that this block looks for are as follows.

Name
Type
Description

GroupGuid

Guid

The guid of the group you wish to edit.

Block Configuration

Show Header

This setting determines whether a "Group Details" header should be displayed.

Limiting Group Configuration

Each configurable facet of the group will have two options, one to show the field and the other to enable the ability to edit the field.

These are the configurable fields. For instance, if I wanted to show the group name and disable the ability to edit it, I could leave Show Group Name checked, but uncheck Enable Group Name Edit. It's also important to keep in mind that if a field isn't shown, it isn't possible to edit it, so that value will be irrelevant.

Attribute Category

This should be set to a category of group attributes that you would like to show and be editable.

Group Detail Page

Group Finder

Display a list of groups based on a series of filters.

This block provides the ability to search for groups based on campus, day of week, time of day, location, and custom attributes.

Note: If location searching is enabled, groups with no location set will not be included in the results.

Query Strings

Value
Description

LoadResults

true

Bypasses the filter and shows results immediately.

Template

The Deploy button is not required for content changes.

Merge Fields

Property
Type
Description

DetailPage

Guid

The page GUID defined in the block settings.

Groups

List<Group>

A collection of Group objects.

Distances

List<groupId, distance>

A collection of key value pairs with the groupId and distance in miles.

Styles

Class
Type

.group-finder-filter

.campus-picker

.day-of-week-picker

.time-of-day-picker

.group-finder-search-button

Group Member Edit

Edits a member of a group.

Getting Content

Page parameters

The parameters that this block looks for are as follows.

Name
Type
Description

GroupMemberGuid

Guid

The guid of the group you wish to display members of.

Block Configuration

Show Header

If enabled, a header containing a "Group Member Edit" title will be displayed.

Allow Role Change

If enabled, you will be able to modify a group member's role within this block.

Allow Member Status Change

If enabled, you will be able to modify a group member's status.

If enabled, you will be able to modify the group member's communication preference.

Allow Note Edit

If enabled, you will be able to modify the group member's notes.

Attribute Category

This references the category of attributes that will be displayed and modifiable.

Member Detail Page

Enable Delete

This action will show/hide the delete button. If enabled, it will either delete or archive the member based on the group type configuration. More specifically, the Enable Group History setting must be checked and the Process Group History job must run in order for the Archive button to appear.

Delete Navigation Action

The action to perform after the group member is deleted from the group.

Group Member List

Allows the user to view a list of members in a group.

The parameters that this block looks for are as follows.

Name
Type
Description

GroupGuid

Guid

The GUID of the group you wish to display members of.

Block Configuration

Group Member Detail Page

The page will display the group member details when selecting a member.

Including a Group Member View block on this page would not be a bad idea.

Title Template

The value to use when rendering the title text. Lava is enabled.

Template

The Deploy button is required for content changes.

Merge Fields

Property
Type
Description

DetailPage

Guid

The page selected in the Detail Page setting.

Title

String

The text entered in the Title Template setting.

Members

Custom

Only included when the Group By Person setting is disabled. 1. PhotoUrl 2. Id 3. Guid 4. PersonId 5. PersonGuid 6. FullName 7. FirstName 8. LastName 9. NickName 10. GroupRole 11. PhotoId

People

Custom

Only included when the Group By Person setting is enabled.

Commands

Command
Parameter
Description

Create an entity set and performs a navigation command that passes an EntitySetGuid as a query string parameter.

Creating an Entity Set

This command requires Edit permissions on the following API endpoint: POST api/EntitySets/CreateFromItems/{entityTypeGuid}

You can create an entity set using the group member list by adding the following functionality into your template:

<Button Command="{Binding CreateEntitySetAndNavigate}"
        Text="Create EntitySet and navigate"
        StyleClass="btn,btn-primary">
        <Button.CommandParameter>
            <Rock:CreateEntitySetAndNavigateParameters TimeToExpire="30">
                <Rock:CreateEntitySetAndNavigateParameters.NavigateCommand>
                    <Rock:CommandReference Command="{Binding PushPage}"
                        CommandParameter="f0ef45ac-4eb8-4ad1-b817-408d7d7fe0fc" />
                </Rock:CreateEntitySetAndNavigateParameters.NavigateCommand>
            </Rock:CreateEntitySetAndNavigateParameters>
        </Button.CommandParameter>
</Button>

When the button is pressed, it will generate an entity set, and append the EntitySetGuid to the PushPage command parameter. The command won't execute if the CommandReference isn't a navigation command (i.e. PushPage, ReplacePage, OpenBrowser, etc.)

Group By Person

Filters

Show Include Inactive Members Filter

When enabled, shows a filter option to limit the member list to include inactive members.

By default, inactive members will never be included. The only way to show them is by enabling this setting and turning on this filter in the app.

Show Group Role Type Filter

When enabled, shows a filter option to limit the member list to a specific group role type (IsLeader).

Show Group Role Filter

When enabled, shows a filter option to limit the member list to a specific group role.

Show Subgroup Filter

When enabled, shows a filter option to limit the member list to individuals that also belong in any of the selected child groups.

Show Attendance Filter

Option
Description

Attended

Filters to individuals who have attended within the last x number of weeks.

First Attended

Filters to individuals who had their first attendance within the last x number of weeks.

No Attendance

Filters to individuals who have had no attendance entries for within the last x number of weeks.

Attendance Filter Short Week Range

This value will be used to provide options in the Attendance Filter, meant to be used as a shorter duration of time. For instance, a value of three would equal three weeks in the attendance filtering process. If a value isn't provided, the options won't show.

Attendance Filter Long Week Range

This value will be used to provide options in the Attendance Filter, meant to be used as a longer duration of time. For instance, a value of six would equal six weeks in the attendance filtering process. If a value isn't provided, the options won't show.


Additional Fields

Since the Group Member List block does not provide the full object for the members, Rock Mobile gives you the opportunity to pull in any merge field that is associated with a group member. To do this, you can use either an existing property, attribute, or even add a merge field via a lava expression.

Lava Expression Syntax

{{ item }} will always be the root as that is the Group Member Object. The example below provides the block with theIsLeader merge field.

{{ item.GroupRole.IsLeader }}

Group Registration

Allows a person to register for a group.

Getting Content

Page parameters

The parameters that this block looks for are as follows.

Name
Type
Description

GroupGuid

Guid

The guid of the group you wish to display registration for.

Block Configuration

Group Member Status

The 'Group Member Status' to use when adding a new member.

Group Type Guid

Registration Workflow

Family Options

Provide additional inputs to register additional members of the family upon the current person's registration.

Mobile Phone

Determines if the mobile phone field should be hidden, required, or optional.

Email Address

Determines if the e-mail address should be hidden, required, or optional.

Group

Connection Status

The connection status to use for new individuals upon registration.

Record Status

The record status to use for new individual's upon registration.

Result Page

An optional page to navigate the individual to upon registration. GroupGuid will be passed as a query string parameter.

Registration Completion Message

Prevent Overcapacity Registrations

When this is set to true, a user cannot register for groups that are at capacity. If there is only one spot available, none of the family members can be registered.

Autofill Form

If set to false then the form will not load the context of the logged-in user.

Register Button Text

The text to display in the save button.

Group Member View

Allows the user to view the details about a specific group member.

Parameters

Name
Type
Description

GroupMemberGuid

Guid

The guid of the group member you would like to see details for.

Settings

Setting
Description

Group Member Edit Page

Template

The Deploy button is not required for content changes.

By default, this will output the following:

  1. Group name

  2. Total group member count

  3. Selected group member photo, name, age, and birth date

  4. Visible group member attributes

  5. Contact options including email, SMS, and calling

  6. Edit group member if a page is defined

Merge Fields

Merge Field
Type
Description

AllowedActions

Custom

Includes View, ManageMembers, Edit, and Administrate.

GroupMemberEditPage

Guid

The mobile page selected in the Group Member Edit Page setting.

Member

Group Member

The full Group Member object, which can also be used to access the associated Person data.

VisibleAttributes

Custom

Group Member attributes that the person signed in has View permissions to see. Returns an object with the Key, Name, Value, and FormattedValue for each.

Schedule Toolbox

Accept, decline or cancel scheduled attendances.

This block gives an individual the opportunity to confirm his attendance, decline it (and provide a reason), or cancel an attendance that they previously confirmed. All of this is customizable via the Toolbox Template.

Toolbox Template

Changing this default template allows you to fully customize the schedule toolbox page.

The default template contains two | characters on Lines 47 and 75 which is invalid. Until a fix is in place, you'll need to modify this template and remove the extra pipes.

Merge Fields

Merge fields are fields that the block replaces with applicable information. For instance, in this block, we provide a list of the pending schedules, defined as "ScheduleList". This will provide the entire list of pending, unavailable, and declined attendances. The merge fields we provide for this block are:

Commands

This block offers specific command bindings to use in the Toolbox Template XAML.

Confirm Decline Template

Changing this content allows you to customize the content on the modal that is pushed when a user "declines" an attendance, this is mostly just the header content as the decline reason picker and button are programmed into the block itself.

Merge Fields

Scheduler Receive Confirmation Emails

When enabled, the scheduler will receive an email for each confirmation or decline. Note that if a Group's "Schedule Coordinator" is defined, that person will automatically receive emails.

Scheduling Response Email

The system communication used to send emails to the scheduler for each confirmation or decline. If a Group's "Schedule Coordinator" is defined, this will also be used when sending emails.

Content is passed in through a page parameter, referenced as GroupGuid. There are quite a few examples of passing page parameters (also known as query parameters) lying around the documentation, and here is a great .

This setting should be set to a page that you wish to when the "cancel" button is pressed. It takes the GroupGuid and passes it as a page parameter.

The returned groups matching the filters do not account for user security. Use the HasRightsTo to check view permissions for each group as needed.

Content is passed in through a page parameter, referenced as GroupMemberGuid. There are quite a few examples of passing page parameters (also known as query parameters) lying around the documentation, and here is a great .

Allow Communication Preference Change

The group member page to return to when the "cancel" button is pressed. So for instance, if you were using a to navigate to this detail page, you would want to set this to the page containing that block.

Context is passed in through a page parameter, referenced as GroupGuid. There are quite a few examples of passing page parameters (also known as query parameters) lying around the documentation, and here is a great .

CreateEntitySetAndNavigate

When enabled, the merge field completely changes to People instead of Members. This will cause the block to display each distinct Person instead of the Group Member occurrence. The object also has an attached Roles merge field that you can use to see all of the different roles the distinct Person has.

When enabled, will show up each of these options for both the option and option (x in the examples).

Content is passed in through a page parameter, referenced as GroupGuid. There are quite a few examples of passing page parameters (also known as query parameters) lying around the documentation, and here is a great .

The group type identifiers which are valid to use as the You can use this to limit registration to certain group types.

An optional workflow to start for each individual being added to the group. The GroupMember will be set as the workflow entity. The current/primary person will be passed as the workflow initiator. If you are unfamiliar with workflows, please take a look at .

The group to provide registration for. If this is left blank, it will be inferred that the guid of the group will be retrieved from the .

The lava template that is used to format the result message after a user has been successfully registered. Note that if you set a , this setting will be irrelevant.

The page to navigate to for editing the selected group member. You'll generally use a block here.

This block manages scheduling opportunities for an individual, allowing them to 'Accept' or 'Decline' an attendance request, or cancel a previously accepted or declined request. If you are unfamiliar with group scheduling in Rock, please refer to .

Property
Type
Description
Command
Description
Property
Type
Description
Lava filter
Group Member List
Workflows in Rock
example
example
example
example
Template
Attendance Filter Short Week Range
Attendance Filter Long Week Range
page parameter.
page parameters
result page

ScheduleList

List<ScheduleData>

A list of all of the specific individual's schedule information.

PushScheduleConfirmModal

Pushes a modal that allows a user to provide a decline reason for the specific attendance. If a decline reason is marked as required in the GroupType settings, it will reflect that. You can customize the content of this modal in the "confirm decline template", as seen below.

ConfirmAttend

Marks an attendance as "confirmed".

SetPending

Sets an attendance back to a state of neither "confirmed" or "declined".

Attendance

Attendance

The specific attendance that the user is attempting to decline.

Group Member Edit

Group View

Displays a page to allow the user to view the details about a group.

Parameters

Name
Type
Description

GroupGuid

Guid

The guid of the group you wish to view the details of.

Settings

Description

Group Edit Page

The page that will be navigated to when the 'edit' button is pressed. GroupGuid will be passed in as a page parameter.

Show Leader List

Specifies if the leader list should be shown, this value is made available to the template as ShowLeaderList.

Template

The Deploy button is not required for content changes.

Merge Fields

Property
Type
Description

Group

Group

The group that is retrieved from the GroupGuid parameter.

GroupEditPage

Guid

The Guid of the page that is passed when the Edit button is pressed. Retrieved from the Group Edit Page block configuration.

ShowLeaderList

boolean

True or False depending on the Show Leader List setting.

StackLayout
Picker
Picker
Picker
Button
CommandReference
Rock Your Groups - Group Scheduling

Schedule Preference

Set your preferences for group scheduling.

Group Selection

If a user is enrolled in more than one group that has group scheduling enabled, it will first prompt them with a group selection page, provided in the screenshot below. If an individual is not enrolled in any groups, a friendly message is displayed to reach out to the church if they are interested in volunteering.

With 'Children's' and 'Greeters' being the groups that the individual is enrolled in. This allows a user to set their preferences on a per-group basis.

Preferences

Add Assignment

The 'Add Assignment' button will prompt them with a modal to allow an individual to request exact group scheduling opportunities, as exampled below:

This allows an individual to set their scheduling preferences, so an administrator (and auto-scheduling) knows their preferred dates, times, and locations. If you are unfamiliar with group scheduling in Rock, please refer to the manual.

This is the screen that an individual can update their preferences on. It will automatically update when the user changes the value, with a friendly to notify them that it was successful.

When this form is submitted, it is reflected in the 'Preferences' page with a friendly stating it was successful.

Rock Your Groups - Group Scheduling

Schedule Sign Up

Sign up for additional group scheduling opportunities.

Future Weeks to Show

This block setting sets how many weeks into the future you would like an individual to be able to sign-up for. For instance, if today is 6/1/2022, and I have this block setting set to '6', I will be able to sign up for dates and times through 7/15/2022.

Group Selection

If a user is enrolled in more than one group that has group scheduling enabled, it will first prompt them with a group selection page, provided in the screenshot below. If an individual is not enrolled in any groups, a friendly message is displayed to reach out to the church if they are interested in volunteering.

Schedule Sign-Up

When there are available schedules, a user can easily scroll through and click the dates and times that work for them. If there are multiple locations, a friendly action sheet is displayed that allows an individual to specify a location preference, or not.

Scheduler Receive Confirmation Emails

When enabled, the scheduler will receive an email for each confirmation or decline. Note that if a Group's "Schedule Coordinator" is defined, that person will automatically receive emails.

Scheduling Response Email

The system communication used to send emails to the scheduler for each confirmation or decline. If a Group's "Schedule Coordinator" is defined, this will also be used when sending emails.

Schedule Unavailability

Mark dates to be excluded from when group scheduling.

Here is an example of our rendered default template. Here, you can see your previously scheduled "exclusions", or dates that an individual will be unavailable.

Unavailability Description

You can see above, in the third exclusion, a description was provided and therefore displayed. You can set these as mandatory in the block settings, underneath the "Schedule Unavailability Template".

This allows an individual to sign up for additional scheduling opportunities, instead of having to be scheduled for a particular location and time through an administrator. This block is heavily dependent on group configuration for scheduling so if you are unfamiliar with group scheduling in Rock, please refer to .

This block allows an individual to schedule dates that they (or their household members) are unavailable, so an administrator knows not to schedule them on these days. If you are unfamiliar with group scheduling in Rock, please refer to .

Rock Your Groups - Group Scheduling
Rock Your Groups - Group Scheduling

Prayer

This section refers to the 'Prayer' mobile block group.

Answer To Prayer

Displays an existing prayer request and allows the user to enter the answer to prayer.

Getting Started

Query Parameters

The query parameters this block looks for upon initialization are as follows.

Name
Type
Description

RequestGuid

Guid

The Guid of the prayer request being answered.

Block Configuration

Return Page

If set then the current page will be replaced with the Return Page on Save. If not set then a Pop Page is performed instead.

Enforce Security

Ensures that the person editing the request is the owner of the request.

Template

The template for how to display the prayer request.

Merge Fields

In the template, you have access to these objects:

Field
Type
Description

PrayerRequest

The prayer request that is being answered.

If you haven't yet set up a block that lists prayer requests in some order, I would recommend starting with that. A couple of examples of those are and . Those blocks both have a setting that should link to a page containing this block.

Prayer Card View
My Prayer Requests

My Prayer Requests

Shows a list of prayer requests that the user has previously entered.

This block is used by an individual to manage the prayer requests that they've previously posted.

Query Parameters

The query parameters this block looks for upon initialization are as follows.

Name
Type
Description

GroupGuid

Guid

An optional Guid of the group to filter prayer requests to.

Block Configuration

Edit Page

Answer Page

Merge Fields

In the template, you have access to these objects:

Field
Type
Description

PrayerRequestItems

The entire list of prayer requests.

EditPage

Guid

The Guid of the page to edit a prayer request.

AnswerPage

Guid

The Guid of the page to answer a prayer request.

The page that will be used for editing a prayer request. Try setting this to a page containing the block.

This page is used for allowing the user to enter an answer to prayer. Try setting this to a page containing the block.

List<>

Prayer Request Details
Answer To Prayer

Prayer Session

Displays a collection of approved prayer requests one at a time for focused experience.

Typically prefixed by the Prayer Session Setup block, this provides many configuration options for a tailored and intimate prayer time.

To display multiple prayers at once, check out the Prayer Card View block.

Parameters

Name
Type
Description

PrayerCategory

Guid

An optional Guid of the category key.

GroupGuid

Guid

An optional Guid to filter prayer requests to the specific group.

MyCampus

bool

An optional boolean to filter to the context of the current campus.

Settings

Name
Type
Description

Prayed Button Text

string

The text to display inside the Prayed button. Available in the XAML template as Lava variable PrayedButtonText.

Show Follow Button

bool

Indicates if the Follow button should be shown. Available in the XAML template as Lava variable ShowFollowButton.

Show Inappropriate Button

bool

Indicates if the button to flag a request as inappropriate should be shown. Available in the XAML template as Lava variable ShowInappropriateButton.

Public Only

bool

If enabled then only prayer requests marked as public will be shown.

Inappropriate Flag Limit

int

The number of flags a prayer request has to get from the prayer team before it is automatically unapproved.

Create Interactions for Prayers

bool

If enabled, this block will record an Interaction whenever somebody prays for a prayer request.

Include Group Requests

bool

Includes prayer requests that are attached to a group.

Order

select

The order in which to display the individual prayer requests. Please note, that if the request has the Urgent flag it will be displayed before the actual ordering configured in this block.

Merge Fields

Field
Type
Description

PrayedButtonText

string

Prayed Button Text

ShowFollowButton

bool

Show Follow Button

ShowInappropriateButton

bool

Show Inappropriate Button

SessionContext

string

A JSON dictionary representing the Session Context.

Request

PrayerRequest

A Prayer Request object.

PrayerRequest
PrayerRequest

Prayer Card View

Provides an additional experience to pray using a card based view.

The prayer card view block provides an intuitive experience of prayer using a card-based view. Users can scroll through and pray for open prayer requests, by tapping a button when they have finished their prayer. When the button is tapped, the total prayers received count is incremented and can be viewed in the prayer details.

Getting Content

To get content for this list, you must first make sure there are open prayer requests. If there are not or you are unsure, navigate to People > Prayer on your Rock server. In the prayer requests section, you can see if there are any active prayer requests and/or add one for demonstration.

Query Parameters

The query parameters this block looks for upon initialization are as follows.

Name
Type
Description

CampusGuid

Guid

An optional Guid of the campus to display prayer requests for.

Block Settings

Template

This is the main template that is used to display the entire view of an individual's prayer requests. You can make changes here to edit styling and functionality (if desired).

Merge Fields

In the template, you have access to these objects:

Field
Type
Description

PrayerRequestItems

The entire list of prayer requests.

PrayedWorkflowType

Guid

The guid of the workflow to launch when a user marks that they have prayed.

LastPrayed

The entire list of last prayed details.

Merge field types

These merge fields offer a few unique types, PrayerRequest and PrayerRequestLastPrayedDetail.

PrayerRequest Type

The PrayerRequest type offers these entity properties.

Property
Type

FirstName

string

LastName

string

Email

string

RequestedByPersonAliasId

int (optional)

CategoryId

int? (optional)

Text

string

Answer

string

EnteredDateTime

DateTime

ExpirationDate

DateTime (optional)

GroupId

int (optional)

AllowComments

bool

IsUrgent

bool (optional)

IsPublic

bool (optional)

IsActive

bool (optional)

IsApproved

bool (optional)

FlagCount

int (optional)

PrayerCount

int (optional)

ApprovedByPersonAliasId

int (optional)

CampusId

int (optional)

ApprovedOnDateTime

DateTime (optional)

LanguageValueId

int (optional)

PrayerRequestLastPrayedDetail

The PrayerRequestLastPrayedDetail type offers the following properties.

Property
Type

RequestId

int

PrayerDateTime

DateTime

FirstName

string

LastName

string

Title Content

The XAML content to show below the campus picker and above the prayer requests.

Hide-Campus When Known

Always Hide-Campus

If this is set to Yes, the block hides the campus picker and disables filtering by campus.

Category

A top-level category. This controls which categories are shown when starting a prayer session.

Public Only

If selected, all non-public prayer requests will be excluded.

Order

The order that requests should be displayed.

Campus Types

Allows selecting which campus types to filter campuses by.

Campus Statuses

This allows selecting which campus statuses to filter campuses by.

Max Requests

The maximum number of requests to display. Leave blank for all.

Load Last Prayed Collection

Loads an optional collection of last prayed times for the requests. This is available as a separate merge field in Lava.

Prayed Workflow

An optional workflow type to launch when someone presses the Pray button. Prayer Request will be passed to the workflow as a generic Entity field type. Additionally, if the workflow type has any of the following attribute keys defined, those attribute values will also be set as: PrayerOfferedByPersonId.

Include Group Requests

Includes prayer requests that are attached to a group.

List<>

List<>

If this is set to Yes, the campus picker will be hidden if the campus can be inferred from CurrentPerson or as a page parameter. If is set to Yes, this setting will be irrelevant.

Always Hide-Campus
PrayerRequest
PrayerRequestLastPrayedDetail

Prayer Session Setup

Displays some options to the user to configure their prayer session.

Settings

Name
Type
Description

Title Text

string

The title to display at the top of the block. Leave blank to hide.

Instruction Text

string

Instructions to help the individual know how to use the block.

Prayer Page

Guid

The page to push onto the navigation stack to begin the prayer session.

Parent Category

Guid

The parent category to use as the root category available for the user to pick from.

Show Campus Filter

bool

If enabled and the user has a primary campus, then the user will be offered to limit prayer requests to just their campus.

Prayer Request Details

Displays a form to submit a new prayer request or edit an existing one.

In this update, the block now supports the inclusion of prayer request attributes. Those of the supported Field Types will be included in the form.

Parameters

Name
Type
Description

RequestGuid

Guid

The Guid of the request you wish to display details of.

GroupGuid

Guid

An optional page parameter containing the Guid of the specific group.

Guid

If passed in, this will update the block to use the Person with the Guid corresponding to this value instead of the currently logged-in person.

Settings

Name
Description

Show Category

If disabled, category selection will be unavailable, and only the default category will be applied.

Parent Category

A top-level category. This controls which categories the person can choose from when entering their prayer request.

Default Category

The default category to use for all new prayer requests.

Enable Auto Approve

If enabled, prayer requests are automatically approved; otherwise, they must be approved by an admin before the prayer team can see them.

Expires After (Days)

The number of days until the request will expire (only applies when Enable Auto Approve is true).

Show Header

If enabled, an 'Add/Edit Prayer Request' header will be displayed.

Show Urgent Flag

If enabled, requestors will be able to flag prayer requests as urgent.

Show Public Display Flag

If enabled, requestors will be able to set whether or not they want their request displayed on the public website.

Default to Public

If enabled, all prayers will be set to public by default.

Character Limit

If set to something other than 0, this will limit the number of characters allowed when entering a new prayer request.

Show Campus

Should the campus field be displayed? If there is only one active campus then the campus field will not show.

Require Campus

Require that a campus be selected. The campus will not be displayed if there is only one available campus, in which case if this is set to true then the single campus is automatically used.

Require Last Name

Requires that the requestor's last name be entered. The first name is always required.

Enable Person Matching

Links the prayer request to an existing person if a match can be made between the requester and an existing person.

Completion Action

The action performed after saving the prayer request.

Completion Xaml

The XAML markup that is used when the Completion Action is set to Show Completion Xaml. Lava is supported.

Workflow

An optional workflow to start when a prayer request is created. The PrayerRequest will be set as the workflow 'Entity' attribute when processing is started.

This block is used to begin a prayer session using the Prayer Session block. If you are unfamiliar with Rock's prayer functionality, please refer to the .

RequestorPersonGuid

Rock: Prayer Overview

Reminder Edit

Allows a reminder to be edited or created.

Block Configuration

Header Template

This is the template used to display important action-related UI. Unless you have a proficient understanding of data bindings and XAML, you should only really make styling tweaks in here.

Save Navigation Action

The navigation action to perform when the save button is pressed.

Page Parameters

This block looks for the following page parameters (query string).

Key
Type
Description

ReminderGuid

Guid

The Guid of the existing reminder you wish to edit.

EntityTypeGuid

Guid

The Guid of the Entity Type of the Reminder you're creating.

EntityGuid

Guid

The Guid of the entity of the Reminder you're creating.

Reminder List

Display a list of reminders based on query string information.

Block Configuration

Reminder Edit Page

The page to navigate to when a reminder is pressed.

Reminder Types Include

Reminder Type Exclude

Completion Display Delay

This is the amount of time, in milliseconds, that it will take from a reminder that has been completed/incompleted to be removed from the UI. This only actually happens if the reminder should no longer be displayed (e.g. filter is set to Incomplete, and you completed a reminder). This delay provides a window of time to undo an accidental mark of completion/incompletion.

Page Parameters

This block looks for the following page parameters (query string).

Key
Type
Description

EntityTypeGuid

Guid

The type of entity to display reminders for.

EntityGuid

Guid

The entity to display reminders for.

ReminderTypeGuid

Guid

The reminder type to limit this list to.

PersonGuid

Guid

The specific Person to display reminders for.

GroupByType

bool

If enabled, the reminders will be grouped by their ReminderType.

CollectionHeader

string

The text to display at the top of the collection of reminders.

CompletionFilter

CompletionFilter

The Completion Filter.

DueFilter

DueFilter

The Due Filter.

StartDateFilter

DateTime

If provided, the reminders will only be shown that have a ReminderDate later than the value provided.

EndDateFilter

DateTime

If provided, the reminders will only be shown that have a ReminderDate that precedes the value provided.

ReminderTypeFilter

Guid

The reminder type to filter this list to.

PageLoadSize

int

The amount of reminders to load at a time.

Completion Filter

This object is designed to provide filter information of the completion status of a reminder.

Name
Value
Description

None

0

There should be no completion filtering (incomplete & complete) should show.

Active

1

Limit to reminders that are currently active.

Complete

2

Limit to reminders that are completed.

Incomplete

3

Limit to reminders that are not complete.

Due Filter

This object is designed to provide filter information of the due date of a reminder.

Name
Value
Description

None

0

There should be no due date filtering.

Due

1

Limit to reminders that are past due.

DueThisWeek

2

Limit to reminders that are due this week.

DueThisMonth

3

Limit to reminders that are due this month.

Reminders can be deleted by swiping left on the reminder item.

To link Person Alias reminders to a Person Profile page, you just need to ensure that there is a Profile Page set in your application settings.

That page will be navigated to with PersonGuid passed along as the parameter.

The reminder types to include. Leave all unchecked to include all reminder types (except for the reminder types selected in ).

The reminder types to exclude. This setting is only effective if no specific reminder types are checked in.

Delete Reminder

Link to Profile Page

Reminder Type Exclude
Reminder Types Include

Security

This section refers to the "Security" mobile block group.

Onboard Person

Rock Security Settings are utilized to limit account access via passwordless login. The disabling of duplicate checking and passwordless login for specific profile protection levels is recommended.

This is a powerful block (commonly referred to as Onboarding) with many configuration options, so we'll explain all of the screens below and the settings available for each. The purpose of this block is to walk users through a step-by-step process of creating an account (or signing in) and confirming demographic information, campus, and notification preferences.

Hello Screen

This initial screen greets people and begins the account validation process. It supports entering a mobile phone or email address for account verification, skipping the onboarding process entirely, or going straight to the Login page.

The email option will appear when Rock has an active email transport configured and the system communication is not null. The Phone option will appear when Rock has an active SMS transport configured and the system communication From number is not null. If you've made changes to these elements, be sure to Deploy and reload the app to see the appropriate options reflected.

The Title and Subtitle shown here can be customized in the block settings (this is true for all screens). The option to Skip onboarding is optional for those who want to require everyone to go through this process. This is handy when your app requires people to be signed in or have campus context.

Verification

You'll need to create a new system communication in Rock for verification to work. In the Message Template for Email and SMS, you'll need to include the {{ Code }} merge field, which will insert a unique six-digit number into each person's communication. They'll be asked to enter it on the next screen.

Don't forget to update the System Communication in the block settings. We recommend keeping these messages brief and putting the code towards the beginning so that it can be easily read within the mobile notification.

Code Sent Screen

Name Screen

This screen is shown once a code has been verified. These fields will be pre-filled if a person match was found, otherwise a new account will be created. This gives everyone the opportunity to correct any issues with their name.

Person Matching

The phone number or email address that was verified may belong to an existing account. If so, we can safely assume this is the same person and fill in their information in advance.

If the verified contact method is linked to more than one account in Rock, we can't be sure who it is. A new account will be created instead, which may need to be merged later.

Personal Information Screen

This screen has a few block settings available. You can set both the Gender and Birthday questions to Hidden, Optional, or Required. You can also hide the fields if a person match was found and the value is already known. If both questions are set to be skipped, this screen will also be skipped.

Contact Information Screen

Interests Screen

This screen will only appear when Communication List Categories has been set in the block settings.

Notifications Screen

By default an app requests permission to send notifications when it's first opened. You can turn this off in the Application settings (the Enable Notifications Automatically option under Advanced Settings) and instead ask during the onboarding process, which might be a better UX. This screen provides a place to explain why someone might enable notifications and what kind of content they could expect to see. You can turn this screen off in the block settings with the Show Notifications Request option.

In the case where onboarding is optional or someone signs in without seeing this screen, you can check this value and show a button to enable push notifications elsewhere.

{% if AppValues.core_PushNotificationHasBeenRequested != true %}
    <Button Text="Enable Notifications" Command="{Binding EnablePushNotifications}" />
{% endif %}

Campus Screen

This screen is shown to those that do not have a campus selected, or when the Hide Campus if Known setting is No. The campuses available for selection can be set to Physical or Online with a status of Closed, Open, or Pending. You can also select a single campus for the Online and Do Not Attend options, which will make the associated buttons appear.

Create Login Screen

This screen can be set to Hidden, Optional, or Required in the block settings with Create Login.

This screen is straightforward - it confirms the correct code is entered and proves the person is who they say they are. This is an important step to complete first since we don't want accounts being highjacked. If the code is invalid, they'll be sent back to the to try again. You can configure the time limit, IP throttle limit, and attempt limit in the block settings to prevent malicious behavior.

Once a request has been made for push notifications, a new is created with the following key: core_PushNotificationHasBeenRequested

Hello Screen

Codex

All screenshots should be generated on both iOS and Android so that users can see the slight differences on each platform. On an iPhone, you should use the Simulator configured for an iPhone 11. For Android, we recommend a Pixel 2 - though any device that runs at 1080x1920 resolution will work. When using the iOS simulator, it must be run on the Mac directly. Using it through Visual Studio on a PC will result in an incorrect image as it will attempt to pre-apply the border mask.

Once you have your screenshots, drag the iOS screenshot into the bottom left device. Once it is in place, select the screenshot in the left-panel (bubble 1 below). Next center it horizontally and vertically using the center align buttons (bubble 2 below). Next drag your Android screenshot into the bottom right device. Again select it in the left-panel (bubble 3 below) and center it using the same buttons you used for the iOS screenshot.

To export, click on the Devices word just above the top two devices, you should see a blue outline around both of the top devices. Finally click the "Export Devices" button. Save the file to disk.

Once you have saved the image you probably want to cleanup your template. Select the two images (bubbles 1 and 3) and delete them.

Reminder Dashboard

Displays general reminder information and filtering options for the Current Person.

Block Configuration

Reminder List Page

The page that is navigated to when a Reminder Type or filter card option is pressed.

Reminder Edit Page

The page that is navigated to when the Add Reminder button is pressed.

Reminder Types Include

Reminder Type Exclude

Enable Color Pair Calculation

When enabled, the filter cards and reminder icons will automatically apply color recipies to ensure the foreground and background color pass accessibility tests and standards.

We use the Figma service to generate screenshots. When you are ready to contribute screenshots for documentation you will need to create an account there. Once your account is setup you can go to this to create your own personal screenshot template. You only need to visit it once, from then on just login to Figma and it will show in your personal templates, and if you accidentally mess it up, just delete it and visit the above link again.

The reminder types to include. Leave all unchecked to include all reminder types (except for the reminder types selected in ).

The reminder types to exclude. This setting is only effective if no specific reminder types are checked in.

link
Reminder Type Exclude
Reminder Types Include

Application Strategy

Below are some points to consider when developing your application.

  1. Think through each block you add. Determine where it should be run (client and/or server). If at all possible have it run on the client. For example if you have a Content block on a page that acts as a header it can be downloaded to the client and never needs to call the server on the page load.

XAML Styling

Below are various styling rules we recommend when writing XAML.

  1. When using a StyleClass place it as the first parameter when defining Labels, or when the CSS class name helps define the intent of the control. Good: <Label StyleClass="h1" Text="My Title" /> Bad: <Label Text="My Title" StyleClass="h1" />

  2. When using a control (like a Label) that does not need a body do not provide an end tag. Good: <Label Text="My Label" /> Bad: <Label Text="My Label"></Label>

Laying Out Your Application

Horizontal Alignments

When you need to align controls horizontally you have quite a few options. We recommend using the following guidelines when selecting a strategy.

  1. ResponsiveLayout - ResponsiveLayouts are a Rock Mobile addition that create column grids much like Bootstrap's grid in CSS. It allows you to provide a different number and size of columns based on the size of the view. Web Equivalent: Bootstrap Grids

- StackLayouts are a performant away to align controls horizontally (Orientation="Horizontal"). StackLayouts don't offer a lot in the way of placement options. Web Equivalent: DIVs with floats

- The Xamarin Forms Grid is a very powerful layout tool. It can slow down performance a bit if they become too numerous or complex. Web Equivalent: HTML Tables (on steroids)

Others (//) - There are numerous other options to look at. Their uses are more advanced.

StackLayout
Grid
AbsoluteLayout
RelativeLayout
FlexLayout

Resources

Below are resources for digging in deeper.

Recipes

A good developer reads as much code as they write. - Anonymous

“To steal ideas from one person is plagiarism; to steal from many is research.” – Anonymous

Below are some sources you can turn to to see how other Xamarin developers have crafted amazing apps.

(especially good)

(warning this does contain some closed source components)

Ask Xammy Blog
Burger App
SyncFusion Essential UI Kit

Documentation

Demo App

When updating the demo app there are CSS styles and snippets that can help you out. Below are some examples.

To add a code snippet in the demo app use:

<Label StyleClass="code">
    {{ '<Rock:Image Source="https://yourserver.com/photo.jpg" />' | XamlWrap }}
</Label>

Result:

Note the code CSS class handles the styling. For code snippets that are more than one line you'll need to use a Lava capture.

<Label StyleClass="code">
        {% capture source %}<Button Text="Action Name" 
        StyleClass="btn, btn-primary-outline"  />{% endcapture %}{{ source | XamlWrap }}</Label>

Commands

The .NET MAUI framework and the Rock Mobile application shell both utilize Commands to manage most actions and events. When a button is tapped, a Command executes. Typically, a Command is accessible via a Command property, although sometimes a view may support multiple Commands, in which case their names vary. Additionally, each Command can accept a parameter to fine-tune how it performs its task.

Since all Commands follow the same structure, you can use any Command anywhere. For instance, a Command configured for a button to open a browser window can also be assigned to a swipe gesture, enabling a browser to open when an individual swipes the screen.

Below, you’ll find details about various Commands. But first, here’s a quick example of using Commands. Here’s how to set up a button to open a browser window when tapped:

<StackLayout>
    <Button Text="Search"
            StyleClass="btn, btn-primary"
            Command="{Binding OpenBrowser}"
            CommandParameter="https://www.google.com/search?q=rockrms" />
</StackLayout>

Here, we bind the button's Command to the built-in OpenBrowser handler and pass the URL via the CommandParameter. Now, let’s add a textbox where an individual can enter a search term, using that term in the URL.

<StackLayout>
    <Rock:FieldContainer>
        <Rock:TextBox Label="Search" x:Name="SearchTerm" />
    </Rock:FieldContainer>

    <Button Text="Search"
            StyleClass="btn, btn-primary"
            Command="{Binding OpenBrowser}">
        <Button.CommandParameter>
            <Rock:OpenBrowserParameters Url="https://www.google.com/search">
                <Rock:Parameter Name="q"
                                Value="{Binding Path=Text, Source={x:Reference SearchTerm}}" />
            </Rock:OpenBrowserParameters>
        </Button.CommandParameter>
    </Button>
</StackLayout>

In this example, we create an inline object in XAML within the CommandParameter property of the button. The <Rock:OpenBrowserParameters> object sets the base URL, and the nested parameters are appended as query strings. We define a parameter q, which Google uses for the search term. By binding the textbox's value dynamically with {Binding Source={x:Reference SearchTerm}, Path=Text}, we capture the input text from SearchTerm and insert it as the query value.

Now, we have a search button that opens a search results page using the text input without writing a single line of code!

Most Commands support a simplified form for CommandParameter. As seen in the OpenBrowser example, a static URL can be passed directly if no custom parameters are needed. Each Command specifies the forms its CommandParameter can accept.

Many Commands work within a block’s context (except for the Callback Command, which only functions in Content-derived blocks). While most Commands are accessible outside a block, such as in a flyout menu, some require page-specific context, like ShowActionPanel, which needs to know the page to overlay the panel.

Shorthand Syntax

Command parameter objects also support a shorthand form for XAML extensions, which simplifies the syntax. Here’s a comparison:

<Button Text="Scroll"
        Command="{Binding ScrollToVisible}">
    <Button.CommandParameter>
        <Rock:ScrollToVisibleParameters Anchor="{x:Reference myLabel}"
                                        Position="Start" />
    </Button.CommandParameter>
</Button>

Using the shorthand, this becomes:

<Button Text="Scroll"
        Command="{Binding ScrollToVisible}"
        CommandParameter="{Rock:ScrollToVisibleParameters Anchor={x:Reference myLabel}, Position=Start}" />

This condensed syntax is more succinct but doesn’t support arrays in parameters. When values contain commas, they should be enclosed in single quotes within the double-quoted property string.

<Button Text="Send"
        Command="{Binding SendSms}"
        CommandParameter="{SendSmsParameters Message='Hello, Dave.' Recipients=1558881234}" />

Binding Context Considerations

Complex binding scenarios often arise with nested action items like ShowCoverSheet, ShowActionPanel, and ShowPopup. These items may require additional BindingContext references to maintain functionality at deeper nesting levels, as demonstrated below:

<Button x:Name="BindingContext" 
        Text="Action Panel With Aggregate Bindings"
        Command="{Binding ShowActionPanel}">
            
        <Button.CommandParameter>
            <Rock:ShowActionPanelParameters Title="Action Panel Bindings"
                                        CancelTitle="Cancel">
                
                <Rock:ActionPanelButton Title="AggregateCommand"
                                    Command="{Binding BindingContext.AggregateCommand, Source={x:Reference BindingContext}}">
                    
                    <Rock:ActionPanelButton.CommandParameter>
                        <Rock:AggregateCommandParameters>
                            <Rock:CommandReference Command="{Binding BindingContext.ShowToast, Source={x:Reference BindingContext}}"
                                               CommandParameter="Successful binding implementation" />
                            <Rock:CommandReference Command="{Binding BindingContext.PushPage, Source={x:Reference BindingContext}}"
                                               CommandParameter="2cda9cfc-4717-4455-bfc2-633735cda86f" />
                        </Rock:AggregateCommandParameters>
                    </Rock:ActionPanelButton.CommandParameter>
                </Rock:ActionPanelButton>
            </Rock:ShowActionPanelParameters>
        </Button.CommandParameter>
</Button>

In this configuration, BindingContext references ensure the Commands remain connected to the correct data context at each level.

Communication Commands

CallPhoneNumber

We're sure you can think of other uses, but wouldn't it be nice if your application had your church's phone number displayed somewhere and the user could just tap on it to call your church office? Yep. That would be nice. If only the user was on a phone or something like that.

The CommandParameter specifies the phone number to be dialed, if it's blank then nothing will happen.

<Button Text="Tap"
    Command="{Binding CallPhoneNumber}"
    CommandParameter="15552138874" />

SendEmail

With this command, you can request to create a new e-mail to be sent to a number of people. Notice that we said "request". This does not immediately send the e-mail but simply uses the OS standard e-mail application. In most cases, the user is sent over to the e-mail application and can then later return to your application.

If the CommandParameter is a plain string, then it is used as a comma-delimited list of e-mail addresses that the e-mail should be sent to. Alternatively, you can specify a SendEmailParameters object and supply the subject, the initial text to use as the e-mail body as well as the list of recipients. This object is described below. Finally, you can also omit the CommandParameter entirely and it will simply open up a new blank e-mail for the user to send.

Property
Type
Description

Subject

string

The subject of the e-mail to be sent, this is optional and the user will be able to edit before it is sent.

Message

string

The body of the e-mail to be sent, this is optional and the user will be able to edit the content before it is sent.

Recipients

List<string>

The e-mail addresses that will receive the e-mail. While this is a list of strings, it also accepts a comma delimited string to specify multiple e-mail addresses at once.

<Button Text="Tap"
    Command="{Binding SendEmail}"
    CommandParameter="ted@rocksolidchurchdemo.com" />
<Button Text="Tap"
    Command="{Binding SendEmail}">
    <Button.CommandParameter>
        <Rock:SendEmailParameters Subject="Welcome to Rock!"
            Message="Thanks for saying you are coming to church tonight!"
            Recipients="ted@rocksolidchurchdemo.com, cindy@fakeinbox.com" />
    </Button.CommandParameter>
</Button>
<Button Text="Tap"
    Command="{Binding SendEmail}"
    CommandParameter="{SendEmailParameters Subject=Welcome to Rock!, Recipients=ted@rocksolidchurchdemo.com}" />

SendSms

Don't you wish you could add a button with an icon of a chat bubble to your application that would allow your user to send a text message? Yeah, we did too. With this command, you can request to create a new text message to be sent to a number of people. Notice that we said "request". This does not immediately send the text message but simply uses the OS standard messaging application. In most cases, the user is sent over to the message application and can then later return to your application.

If the CommandParameter is a plain string, then it is used as a comma-delimited list of phone numbers that the message should be sent to. Alternatively, you can specify a SendSmsParameters object and supply the initial text to use as the message body as well as the list of recipients. This object is described below. Finally, you can also omit the CommandParameter entirely and it will simply open up a new blank message for the user to send.

Property
Type
Description

Message

string

The body of the message to be sent, this is optional and the user will be able to edit the content before it is sent.

Recipients

List<string>

The phone numbers of the people who will receive the message. While this is a list of strings, it also accepts a comma delimited string to specify multiple numbers at once.

<Button Text="Tap"
    Command="{Binding SendSms}"
    CommandParameter="15551239876" />
<Button Text="Tap"
    Command="{Binding SendSms}">
    <Button.CommandParameter>
        <Rock:SendSmsParameters Message="Welcome to Rock!"
            Recipients="15551239876,15552224444" />
    </Button.CommandParameter>
</Button>
<Button Text="Tap"
        Command="{Binding SendSms}">
    <Button.CommandParameter>
        <Rock:SendSmsParameters Message="Welcome to Rock!">
            <x:String>15551239876</x:String>
            <x:String>15552224444</x:String>
        </Rock:SendSmsParameters>
    </Button.CommandParameter>
</Button>
<Button Text="Tap"
    Command="{Binding SendSms}"
    CommandParameter="{SendSmsParameters Message=Welcome to Rock!, Recipients='15551239876,15552224444'}" />

ShareContent

Using the ShareContent command you can open up the standard OS share dialog that lets the user share a piece of text or a URL to other apps and services.

If the CommandParameter is a plain string then it will simply share the text string. Alternatively, you can specify a ShareContentParameters object and supply additional options as seen below.

Property
Type
Description

Title

string

The title of the share window.

Text

string

A text string to be shared.

Uri

string

A URL string to be shared.

boolean

Indicates that the Uri should be downloaded to the device and then shared as a file so other applications on the device can be used to open the file.

<Button Text="Tap"
    Command="{Binding ShareContent}"
    CommandParameter="Rock ChMS has an app!" />
<Button Text="Tap"
    Command="{Binding ShareContent}">
    <Button.CommandParameter>
        <Rock:ShareContentParameters Title="Endorse Rock!"
            Text="Rock ChMS has an app!"
            Uri="https://www.rockrms.com/" />
    </Button.CommandParameter>
</Button>
<Button Text="Tap"
    Command="{Binding ShareContent}">
    <Button.CommandParameter>
        <Rock:ShareContentParameters Title="Check out this movie!"
            Uri="https://upload.wikimedia.org/wikipedia/commons/c/c5/Big_buck_bunny_poster_big.jpg"
            ShareAsFile="true" />
    </Button.CommandParameter>
</Button>

Property UX

The sharing experience will change depending on the Title, Text, and Uri provided. Providing only a Title will not work ‒ a Text or Uri value is required. Let's review the options using the sample command here:

<Rock:ShareContentParameters Title="What is Rock"
    Text="Learn more about Rock RMS!"
    Uri="https://www.rockrms.com" />

These screenshots show the OS share prompt and content received within the Messages app.

Header Metadata

When sharing content via a URI, it is common for the content to include an image. The image is derived from the metadata of the webpage the URI links to. When using Rock RMS, editing this metadata can be done from within the advanced settings of the desired page.

<meta property="og:url" content="https://rockrms.com/">
<meta property="og:title" content="Rock Mobile">
<meta property="og:image" content="https://upload.wikimedia.org/wikipedia/commons/c/c5/Big_buck_bunny_poster_big.jpg">

Without this metadata present, no image will be displayed when sharing content.

ShareAsFile

Title + Text
Title + Uri
Text + Uri
Uri
Title + Text + Uri

Click for deeper insight on metadata properties.

here
replace the current one with

Media Commands

Block commands pertaining to media content.

PlayAudio

The CommandParameter consists of a string that contains the URL of the audio file to be played.

Property

Type

Description

ThumbnailSource

string

The URL that contains the image to displayed as the thumbnail of the media player. This overrides any embedded artwork found in the metadata.

(See PlayVideoParameters for more properties)

Examples

<Button Text="Tap"
        Command="{Binding PlayAudio}"
        CommandParameter="http://www.noiseaddicts.com/samples_1w72b820/2541.mp3" />
<Button Text="Tap"
        Command="{Binding PlayAudio}">
    <Button.CommandParameter>
        <Rock:PlayAudioParameters
            Source="http://www.noiseaddicts.com/samples_1w72b820/2541.mp3"
            ThumbnailSource="https://upload.wikimedia.org/wikipedia/commons/c/c5/Big_buck_bunny_poster_big.jpg" />
    </Button.CommandParameter>
</Button>

PlayVideo

The CommandParameter consists of a string that contains the URL of the video to be played.

Property

Type

Description

Source

string

The URL of the media to be played.

BackgroundColor

A color to be used behind the media.

Title

string

Overrides any metadata in the media and sets the title text to be displayed.

Subtitle

string

Overrides any metadata in the media and sets the subtitle text to be displayed.

ControlsContent

Contains the view tree that should be used to provide UI controls, this replaces the default controls.

OverlayContent

Contains the view tree that will be displayed over top of the media. The default content only shows for audio files and displays the artwork.

Examples

<Button Text="Tap"
        Command="{Binding PlayVideo}"
        CommandParameter="http://commondatastorage.googleapis.com/gtv-videos-bucket/sample/BigBuckBunny.mp4" />
<Button Text="Tap"
        Command="{Binding PlayVideo}">
    <Button.CommandParameter>
        <Rock:PlayVideoParameters
            Source="http://commondatastorage.googleapis.com/gtv-videos-bucket/sample/BigBuckBunny.mp4"
            Title="Big Buck Bunny" />
    </Button.CommandParameter>
</Button>

Navigation Commands

Block commands pertaining to navigation.

Navigate Mode

Some blocks include a setting called Navigate Mode, which lets you control how navigation to another page should happen. The available options align with specific page navigation commands.

To keep things simple, let’s walk through an example: imagine the current navigation stack has two pages—PageA is the root or home page, and someone has navigated from there to PageB. Now, we want to navigate to a new page, PageC, and see how different Navigate Modes affect the stack.

Value
Description

Push

Pushes a new page onto the navigation stack. If the user presses the back button they will be brought back to PageB

Replace

Replaces the current page with the new page. If the user presses the back button they will be taken to PageA

Show

Replaces the entire navigation stack with the new page. There will be no back button for the user to press.

MapAddress

This command tries to open a location—either an address or coordinates—directly in the device’s default maps app, like Google Maps or Apple Maps. It skips the step of launching a browser, making the experience quicker and more seamless for an individual.

Property
Type
Description

Name

string

The name of the location as you want it to appear on the user's map application.

Address

string

The address to which you want the app to locate.

Latitude

double?

The latitude of a place to locate. Useless without also providing "Longitude".

Longitude

double?

The longitude of a place to locate. Useless without also providing "Latitude".

Using an address (recommended):

<Button Text="Map Address"
    Command="{Binding MapAddress}"
    CommandParameter="{Rock:MapAddressParameters Name='Whatever you want!', Address='27 Street 4059, Nazareth Israel'}" />

Using latitude/longitude:

<Button Text="Map Address"
    Command="{Binding MapAddress}"
    CommandParameter="{Rock:MapAddressParameters Name='Whatever you want!', Latitude='32.69', Longitude='35.30'}" />

OpenAppSettings

This command will open the device's settings application and take the user directly to the settings for your mobile application.

There are currently no parameters available for this command.

<Button Text="Settings" Command="{Binding OpenAppSettings}" />

OpenBrowser

This command allows you to open a web address using the built-in browser inside the application.

If you are opening a URL to your own Rock server and wish to ensure the user is logged in, you can pass an empty rckipid parameter and an impersonation token will be automatically generated.

The CommandParameter can either be a string, which contains the URL and query string parameters, or it can be a reference to an OpenBrowserParameters object which contains the following properties.

Property
Type
Description

Url

string

The URL to be opened. May contain query string parameters.

Parameters

Any additional query string parameters to be included with the URL.

<Button Text="Open Internal"
        Command="{Binding OpenBrowser}"
        CommandParameter="https://www.rockrms.com/" />
<Button Text="Open Internal"
    Command="{Binding OpenBrowser}">
    <Button.CommandParameter>
        <Rock:OpenBrowserParameters Url="https://www.rockrms.com/">
            <Rock:Parameter Name="q" Value="rockrms" />
        </Rock:OpenBrowserParameters>
    </Button.CommandParameter>
</Button>

OpenExternalBrowser

If you are opening a URL to your own Rock server and wish to ensure the user is logged in, you can pass an empty rckipid parameter and an impersonation token will be automatically generated.

The CommandParameter can either be a string, which contains the URL and query string parameters, or it can be a reference to an OpenExternalBrowserParameters object which contains the following properties.

Property
Type
Description

Url

string

The URL to be opened. May contain query string parameters.

Parameters

Any additional query string parameters to be included with the URL.

<Button Text="Open External"
    Command="{Binding OpenExternalBrowser}"
    CommandParameter="https://www.rockrms.com/" />
<Button Text="Open External"
    Command="{Binding OpenExternalBrowser}">
    <Button.CommandParameter>
        <Rock:OpenExternalBrowserParameters Url="https://www.rockrms.com/">
            <Rock:Parameter Name="q" Value="rockrms" />
        </Rock:OpenExternalBrowserParameters>
    </Button.CommandParameter>
</Button>

PopPage

This command works as the opposite of the PushPage command. Simply put, it behaves like the user tapping the back button in the navigation bar—it removes the current page from the stack and brings the previous one back into view. For example, imagine you’ve pushed a page asking the user to confirm an action, and you want a "Cancel" button that takes them back to where they were.

An added option here is that you can choose to reload the previous page before showing it again. To do that, just pass true to the CommandParameter.

This command only works when a navstack is present and there's a page to return to. The navstack is not available when a Page is set to Show Full Screen or the shell's Application Type is set to Blank.

<Button Text="Close" Command="{Binding PopPage}" />
<Button Text="Close" Command="{Binding PopPage}" CommandParameter="true" />

PushPage

This command pushes a new page onto the navigation stack. This type of navigation allows the user to use the back button to return to the page that pushed the new page.

If the CommandParameter is a string, then it is expected to contain a page's GUID value and, optionally, a set of query string parameters. The first parameter is separated by a ? and any additional parameters are separated by &. Since these query string parameters are inside an XML document, you must escape them (for example, your & must become &amp;).

If you are using data binding you can also bind the CommandParameter to a true GUID value, in which case it must be the GUID of a valid page.

Finally, if you need advanced parameter usage you can use a PushPageParameters object.

Property
Type
Description

PageGuid

Guid

The Guid identifier of the page to be pushed onto the navigation stack.

Parameters

Any additional query string parameters to be passed to the page.

WaitForReady

bool

Waits until the page is loaded before displaying it. (Defaults to false.)

<Button Text="Push Page"
    Command="{Binding PushPage}"
    CommandParameter="e4d80e57-da60-4822-bc22-c071f02958e8" />
<Button Text="Push Page"
    Command="{Binding PushPage}"
    CommandParameter="e4d80e57-da60-4822-bc22-c071f02958e8?GroupId=18&amp;Mode=Edit" />
<Button Text="Push Page"
    Command="{Binding PushPage}">
    <Button.CommandParameter>
        <Rock:PushPageParameters PageGuid="e4d80e57-da60-4822-bc22-c071f02958e8">
            <Rock:Parameter Name="GroupId" Value="18" />
            <Rock:Parameter Name="Mode" Value="Edit" />
        </Rock:PushPageParameters>
    </Button.CommandParameter>
</Button>

ReplacePage

If the CommandParameter is a string, then it is expected to contain a page's GUID value and, optionally, a set of query string parameters. The first parameter is separated by a ? and any additional parameters are separated by &. Since these query string parameters are inside an XML document, you must escape them (for example, your & must become &amp;).

If you are using data binding you can also bind the CommandParameter to a true GUID value, in which case it must be the GUID of a valid page.

Finally, if you need advanced parameter usage you can use a PushPageParameters object.

Property
Type
Description

PageGuid

Guid

The Guid identifier of the page to be used to replace the current page.

Parameters

Any additional query string parameters to be passed to the page.

WaitForReady

bool

Waits until the page is loaded before displaying it. (Defaults to false.)

<Button Text="Replace Page"
    Command="{Binding ReplacePage}"
    CommandParameter="e4d80e57-da60-4822-bc22-c071f02958e8" />
<Button Text="Replace Page"
    Command="{Binding ReplacePage}"
    CommandParameter="e4d80e57-da60-4822-bc22-c071f02958e8?GroupId=18&amp;Mode=Edit" />
<Button Text="Replace Page"
    Command="{Binding ReplacePage}">
    <Button.CommandParameter>
        <Rock:ReplacePageParameters PageGuid="e4d80e57-da60-4822-bc22-c071f02958e8">
            <Rock:Parameter Name="GroupId" Value="18" />
            <Rock:Parameter Name="Mode" Value="Edit" />
        </Rock:ReplacePageParameters />
    </Button.CommandParameter>
</Button>

ShowPage

This command replaces the entire navigation stack with a new page. This means there will be no back button to return to any previous page.

If the CommandParameter is a string, then it is expected to contain a page's GUID value and, optionally, a set of query string parameters. The first parameter is separated by a ? and any additional parameters are separated by &. Since these query string parameters are inside an XML document, you must escape them (for example, your & must become &amp;).

If you are using data binding you can also bind the CommandParameter to a true GUID value, in which case it must be the GUID of a valid page.

Finally, if you need advanced parameter usage you can use a PushPageParameters object.

Property
Type
Description

PageGuid

Guid

The Guid identifier of the page to be used as the new page.

Parameters

Any additional query string parameters to be passed to the page.

WaitForReady

bool

Waits until the page is loaded before displaying it. (Defaults to false.)

<Button Text="Show Page"
    Command="{Binding ShowPage}"
    CommandParameter="e4d80e57-da60-4822-bc22-c071f02958e8" />
<Button Text="Show Page"
    Command="{Binding ShowPage}"
    CommandParameter="e4d80e57-da60-4822-bc22-c071f02958e8?GroupId=18&amp;Mode=Edit" />
<Button Text="Show Page"
    Command="{Binding ShowPage}">
    <Button.CommandParameter>
        <Rock:ShowPageParameters PageGuid="e4d80e57-da60-4822-bc22-c071f02958e8">
            <Rock:Parameter Name="GroupId" Value="18" />
            <Rock:Parameter Name="Mode" Value="Edit" />
        </Rock:ShowPageParameters />
    </Button.CommandParameter>
</Button>

Controls

Views are user-interface objects such as labels, buttons, and sliders that are commonly known as controls or widgets in other graphical programming environments.

.NET MAUI Base Views

Like the command, this initiates a full-screen playback of an audio file. Given that it's audio, there won't be much to see.

Starting in you can also pass in a PlayAudioParameters object which contains the following properties.

This command initiates the playing of a video in full-screen. Usually, it is better to use the view instead, but there are times you just want to play a video when the user taps a button.

Starting in you can also pass a PlayVideoParameters object that lets you customize the look of the media player. It contains the following properties.

Note that watch map integration is not currently supported with the PlayVideo command. If this is needed, you'll have to use the component instead.

The address example when the button is tapped.

Note that tokens generated with an empty parameter will use the settings defined in Rock's , which may be more open than your specific implementation needs. Consider your impersonation strategy and understand the risk that individuals can share their impersonated URL without realizing it. Alternatively, you can use the Lava filter .

List<>

Similar to the command, this one opens a URL in a browser window. The difference between the two is that this command uses the devices native web browser and opens the URL in that application. This means your user leaves your mobile app and gets sent over to Safari or Chrome.

Note that tokens generated with an empty parameter will use the settings defined in Rock's , which may be more open than your specific implementation needs. Consider your impersonation strategy and understand the risk that individuals can share their impersonated URL without realizing it. Alternatively, you can use the Lava filter .

List<>

Did you know push page now support anchor-based navigation using fragment identifiers (e.g., #elementName) to automatically scroll to a specific element when a page loads. Read more .

List<>

This command replaces the current page with a new page. This differs from the command. Using the ReplacePage command, if the user then taps the back button then they will be taken back to the page they were on before the page that called the ReplacePage command.

List<>

List<>

The .NET MAUI framework provides a rich collection of base views (controls). You can find a documentation on these views on the .

MediaPlayer
Media Player
global attributes
PersonImpersonationToken
global attributes
PersonImpersonationToken
here
PlayVideo
OpenBrowser
PushPage
Color
View
View
Parameter
Parameter
Parameter
Parameter
Parameter
Microsoft site
SetContext
ShowToast
ShowToast

Utility Commands

AddEventToCalendar

You finally did it. You built that (almost) perfect calendar event detail page. It looks pretty, it shows all the information. You even got the time zone right! If only you could have that "Add to Calendar" button like everybody else.

Well, now your calendar event detail page can be perfect. This command allows you to specify all the details of a one-time event and add it to the user's default calendar.

The first time this command (or any other that accesses the calendar) is used it will prompt the user to allow access to their calendars.

The following properties are required at a bare minimum:

  • StartDateTime

  • Title

  • TimeZoneId

AggregateCommand

This is a special-use command. It allows you to chain multiple commands together. A common usage of this would be to combine the SetContext and ReplacePage commands to change an Entity context and then reload the current page.

You specify the child commands to execute by using an instance of the AggregateCommandParameters object.

Callback

If the CommandParameter is a plain string, then it is used as the name of the callback function to be queried on the server. If you need to pass any parameters to that function then CommandParameter should point to an instance of the CallbackParameters object.

Examples

CopyToClipboard

This command sets text to the user's clipboard through the CommandParameter. It enhances the person experience by simplifying copy-and-paste actions.

The CommandParameter accepts a string representing the text to be copied to the person clipboard.

DownloadPass

This command can be used to download a pass directly to Apple Wallet (with user permission), providing a nicer experience when adding a pass without having to go through a browser intermediary.

Consider hiding this functionality on Android since it is mainly intended for iOS. On Android, this command will simply open an external browser with the URL matching the command parameter.

EnablePushNotifications

Normally, notifications are enabled by the application automatically on launch or during the onboarding process of a new user. But sometimes you might want to display a custom page that talks about why you are going to be sending them push notifications to encourage a better response. This command allows you to initiate the request to enable push notifications.

The optional CommandParameter is an instance of the EnablePushNotificationsParameters object that is outlined below.

Be aware that Android does not ever show a popup message. Instead, it will just automatically enable notifications and then show your EnabledMessage.

Logout

This command will allow you to logout the current person from the application. It will then redirect to the homepage.

  • A string that contains either the value "True" to indicate that the current page should be reloaded, or the Guid of the page to show instead of the home page.

  • An instance of the LogoutParameters object that is outlined below.

PrayForRequest

Prayer is a big thing for churches, at least it should be. To that end, we wanted to make prayer in your mobile applications as easy as possible. Rather than being limited to specific blocks that support prayer, we decided to give you a command that is available in any block. Using this command you can easily add "Pray" buttons to any page and any content block.

The CommandParameter can either be a plain string that represents the unique identifier (Guid) of the prayer request, or it can be an instance of the PrayForRequestParameters object.

Examples

The first example is a simple Pray button. No special processing happens, it just increments the prayer count for the request.

This second example makes use of the PrayForRequestParameters object to disable the interaction and also provide a workflow to be launched.

PageEvent

You learned, or will learn, elsewhere that you can use Lava on the mobile shell to handle certain page events and respond to them. Normally these page events are just ones generated by the system for you. However, you can trigger your own custom page events using this command.

The CommandParameter can either be a plain string that indicates the event name to be triggered, or it can be an instance of the PageEventParameters object. This latter method allows you to pass parameters into your lava logic.

Examples

PerformHapticFeedback

The CommandParameter is a string, but can be left out unless you specifically want to implement the "LongPress" type. Everything else will default to the "Click" type.

Examples

ReloadApplication

This instructs the application to reload as if you had just forced quit and started it again. This is a development tool that saves a few seconds when debugging stuff. It's not a command you'll want to use in a public app.

The CommandParameter is not used and will be ignored.

ReloadPage

This instructs the application to reload the currently displayed page.

The CommandParameter is not used and will be ignored.

ScrollToVisible

There are two ways to initiate this command, we'll show them below. But the basic syntax is you specify the Anchor element that should be scrolled until it becomes visible. Think of this like the HTML Anchor href, or a "jump to" button.

You can either pass the view to be made visible directly by reference in the CommandParameter or you can pass an instance of the ScrollToVisibleParameters object.

The options you have with the Position parameter are as follows:

  • MakeVisible - Just make sure the anchor is visible on screen

  • Start - Attempt to scroll until the anchor is at the start (top or left) of the screen

  • Center - Attempt to scroll until the anchor is at the center of the screen

  • End - Attempt to scroll until the anchor is at the end (bottom or right) of the screen

Examples

The above will scroll the first ScrollView in the view tree above the Label we specified as our anchor so that the label is visible. This by itself may be just fine for what you need, but it may not end up doing what you want. By default, the anchor will be scrolled until it becomes "just visible". In this case, since we need to scroll down, the label will end up at the bottom of the screen.

To accommodate those situations, you can specify a parameters object like so.

This still indicates the same Label we want to use as the Anchor, but it also specifies the position we want it to end up at. Now, this is not a forced position. If there were nothing below the label, it wouldn't be possible for it to end up at the top. But since we have a lot of content below as well, there is enough room to scroll.

Finally, due to the way XAML works, there is a shorthand to the XAML above.

SetAppValue

To utilize an app value, you have access to an AppValues dictionary in Lava:

SetContext

This command allows you to set an entity context value based on a user's action. For example, you could build a custom Campus Context Picker and set the context when the user taps an action button.

The parameter should be an instance of the SetContextParameters class, which is described below.

SetUserPreference

SetViewProperty

There may be times you want to modify the appearance of something or hide it completely, in response to a user action. This command will let you change a property value on a view in your XAML. Here are a few quick examples:

  • Change the StyleClass values applied to a view

  • Show or hide a view by changing IsVisible

  • Disable another button

You might be tempted to try disabling the button that the command is attached to. This will most likely not work. When the command finishes executing the button will be automatically re-enabled. In these cases, you might need to hide the button and show a different, already disabled, button instead.

The CommandParameter must specify an instance of the SetViewPropertyParameters object.

You may notice above that there are two ways to set a property value. If you are only setting a single value you will probably find the Name and Value properties easier to deal with. But you can also set multiple properties at one time by using the Values collection instead. You cannot set properties on multiple views; for that, you would need to use multiple SetViewProperty commands.

Examples

This first example demonstrates a simple action. When the button is tapped then the style class will change from success to danger.

Our next example will show a more advanced version that changes two properties. We are going to do the same transition to a danger button, but also change the text displayed in the button. The first example showed the concise form, but it's a bit harder to read because of how long that string is. The second example will also show the more verbose form, which is a bit easier to read.

ShowActionPanel

This action will show an action panel (think action sheet in iOS terms). This is basically a popup that contains a short message and a number of buttons the user can choose from. A common example of this would be a "reply" button in a mail application. When tapping the button it might then pop up an action sheet that contains a few buttons to help you decide what you intend to do: Reply, Reply All, Forward.

These popups usually have a Cancel button (though it's not strictly required). Additionally, you can specify a single "destructive" button that stands out to the user. Often, this would be a Delete type action and is usually styled red.

The CommandParameter must specify an instance of the ShowActionPanelParameters object.

Examples

Thanks to the magic of XAML, we can simplify the definition of the destructive button a bit if we want, it's up to you.

Write Interaction

Allows you to write an Interaction to Rock when the command is executed. For example, you could write an interaction in response to the user tapping a button. By default, only a single Interaction will be written no matter how many times the command is executed. Normally this is probably what you want. If for some reason you want to allow multiple Interactions to be generated, set the IsMultipleAllowed property to true.

Parameters

In order for your parameters to be considered valid, you must provide at least one of ChannelId or ChannelGuid; and you must provide at least one of ComponentId or ComponentName. Also, note that some event sources will provide defaults for some of the properties in the table below or may even override a value you provide.

Example

ShowPopup

Rock Mobile Shell supports the idea of small popup pages. These don't support navigation but can be useful for a simple display of additional content without leaving the current page.

If the CommandParameter is a string then it will be interpreted as a page GUID with optional query string parameters. This will display a full Rock page inside the popup view.

Alternatively, you can specify a view to use as the content for the popup. This is ideal for showing additional details of items or perhaps a list filter.

Finally, you can specify a ShowPopupParameters object and supply additional options as seen below.

Examples

ClosePopup

Follow

The command is used to follow and unfollow specific entities.

When following a person you'll want to use the PersonAlias entity type, not the Person.

Examples

ShowToast

This command displays a "Toast" style message, often used to show quick and temporary messages, such as "saved" or "updated" and things of the sort.

If the CommandParameteris a string, it will display using the default styles with the command parameter as the message to display.

Examples

ShowCoverSheet

CloseCoverSheet

UpdatePersonProfilePhoto

This command requires Edit permissions on the following API endpoint: POST api/People/UpdatePersonProfilePhoto?personGuid={personGuid}&filename={filename} Starting with v16, the role of 'RSR - Rock Mobile Users' should be given permission. Previous versions should remain using the role of 'All Authenticated Users'

There are some additional command parameters that can be used for extended functionality. These are UpdatePersonProfilePhotoCommandParameters.

Here's an example for using the Image property:

CreateEntitySetAndNavigate

This command is pretty complex. It does two things... First it generates an Entity Set based on the provided parameters and then performs a Navigation command with an appended query string of the entity set value.

Property
Type
Description
Property
Type
Description

Some blocks, currently just the Content block, support what is called Callbacks. You can learn more about these in the and the chapters. But, for our purposes here, you can think of these as an API call back to the server's logic for the block.

Property
Type
Description

To show/hide content based on the device platform, check out the .

You might want to check out the section for an example of how to integrate this command with UI that updates automatically based on notifications being enabled or disabled.

Property
Type
Description

The CommandParameter can be one of the following items:

Property
Type
Description

Property
Type
Description

Property
Type
Description

This is to perform Haptic Feedback on a user's device. If you are unfamiliar with what haptic feedback is, is a good reference.

Property
Type
Description

Property
Type
Description

The mobile shell has a concept of . These are values that survive for the life of the application and allow you to save and read the values later. But what good are app values if you can't set them? The syntax of this command is pretty straightforward. You either provide a parameter value of just a key name; or a key name followed by an equals sign followed by a value.

Property
Type
Description

Save user-specific properties that we only store on the shell. Be careful not to go overboard with these, as they directly affect your application size. In reality, this is just a command that prefixes the key with user-preference-.

Property
Type
Description

Our final example shows how to modify two views in response to a single action using the . In this case, we want to disable the button after it is tapped. But since we can't directly modify the IsEnabled property (since it gets re-enabled after the command finishes) we have to swap it out with a different button. Instead, we first make "myButton3" visible and then make "myButton4" invisible.

Property
Type
Description

This command takes a parameter object of type that contains the following details.

Property
Type
Description

Property
Type
Description

This command is the opposite of the command. If there is an open popup then it will be closed. This command takes no parameters.

Previously, this behavior was only utilized using the , but now with this command, you can easily mimic that to create custom follow/unfollow buttons.

Also, be sure to check out the needed to enable following.

Note that this command does not refresh the page. If you have following icons and expect them to be updated from this command, it does not work as such. Consider using to make visual changes in response to follow and unfollow actions.

Property
Type
Description
Property
Type
Description

Shows a .

Closes any open .

This command is used to update the profile photo of either the CurrentPerson, or if a PersonGuid is supplied as the parameter, it will update theirs. Options are shown with the command, including uploading an existing photo or capturing a new one.

Property
Type
Description

Property
Type
Description
<Button Text="Add to Calendar" Command="{Binding AddEventToCalendar}">
    <Button.CommandParameter>
        <Rock:AddEventToCalendarParameters Title="Rock Solid Finances Class"
            StartDateTime="2021-07-04 18:30:00"
            EndDateTime="2021-07-04 20:00:00"
            Location="3120 W Cholla St, Phoenix AZ, 85029-4113"
            Url="https://www.rocksolidchurchdemo.com/page/414?EventOccurrenceId=3"
            TimeZoneId="America/Phoenix" />
    </Button.CommandParameter>
</Button>
<Button Text="Tap"
    Command="{Binding AggregateCommand}">
    <Button.CommandParameter>
        <Rock:AggregateCommandParameters>
            <Rock:CommandReference Command="{Binding SetContext}">
                <Rock:CommandReference.CommandParameter>
                    <Rock:SetContextParameters Name="Campus"
                        Value="0a3a20eb-c4a8-44fe-9daf-d22b88fae377" />
                </Rock:CommandReference.CommandParameter>
            </Rock:CommandReference>
            <Rock:CommandReference Command="{Binding ReplacePage}"
                CommandParameter="b06173ed-aa2f-43d8-bd38-eb5becca1cbe" />
        </Rock:AggregateCommandParameters>
    </Button.CommandParameter>
</Button>
<Button Text="Tap"
    Command="{Binding Callback}"
    CommandParameter="UserTap" />
<Button Text="Tap"
    Command="{Binding Callback}">
    <Button.CommandParameter>
        <Rock:CallbackParameters>
            <Rock:Parameter Name="GroupId" Value="18" />
        </Rock:CallbackParameters>
    </Button.CommandParameter>
</Button>
<Button Text="Copy to Clipboard"
    Command="{Binding CopyToClipboard}"
    CommandParameter="This text will be copied to your clipboard" />
<Button Text="Download Pass"
    Command="{Binding DownloadPass}"
    CommandParameter="https://church.com/pass.pkpass" />

EnabledMessage

string

The message that will be displayed if notifications have been enabled by the individual. Set to an empty string to not show this message.

Defaults to You're all set to receive push notifications.

DisabledMessage

string

The message that will be displayed if notifications have been disabled by the individual. Set to an empty string to not show this message.

Defaults to Looks like you didn't allow push notifications. If you need to turn them on you can do that in your Settings app.

<Button Text="Logout" 
    Command="{Binding Logout}" />

Guid

Guid

The unique identifier of the prayer request to be prayed for.

RecordInteraction

bool

By default, all pray actions will record an Interaction record in Rock. You can override that by setting this to false. Defaults to true.

WorkflowTypeGuid

Guid?

The pray action can launch a workflow to let you do custom processing on the server for that pray action. Provide a Workflow Type unique identifer here to indicate which workflow should be launched. Defaults to null.

<Button Text="Pray"
    StyleClass="btn,btn-primary"
    Command="{Binding PrayForRequest}"
    CommandParameter="40C6134E-994B-4B11-9711-E867D894FE1B" />
<Button Text="Pray"
    StyleClass="btn,btn-primary"
    Command="{Binding PrayForRequest}">
    <Button.CommandParameter>
        <Rock:PrayForRequestParameters Guid="40C6134E-994B-4B11-9711-E867D894FE1B"
            RecordInteraction="False"
            WorkflowTypeGuid="27B5E487-D451-4025-8BEB-C4EDC354617C" />
    </Button.CommandParameter>
</Button>
<Button Text="Tap"
        Command="{Binding PageEvent}"
        CommandParameter="UserTap" />
<Button Text="Tap"
        Command="{Binding PageEvent}">
    <Button.CommandParameter>
        <Rock:PageEventParameters Event="UserTap">
            <Rock:Parameter Name="GroupId" Value="18" />
        </Rock:PageEventParameters>
    </Button.CommandParameter>
</Button>

HapticFeedbackType

string

The type of haptic feedback you want to implement. Only two accepted values are "Click" or "LongPress".

// Example with no command parameter. Defaults to "Click".
<Button Text="Haptic"
    Command="{Binding PerformHapticFeedback}" />
// Example with the "LongPress" command parameter.
<Button Text="Haptic LongPress"
    Command="{Binding PerformHapticFeedback}" CommandParameter="LongPress" />
<Button Text="Reload"
    Command="{Binding ReloadApplication}" />
<Button Text="Reload"
    Command="{Binding ReloadPage}" />
<StackLayout>
    <Button Text="Scroll"
        Command="{Binding ScrollToVisible}"
        CommandParameter="{x:Reference myLabel}" />

    <BoxView Color="Red"
        HeightRequest="1200" />

    <Label Text="My Label"
        x:Name="myLabel" />

    <BoxView Color="Blue"
        HeightRequest="1200" />
</StackLayout>
<Button Text="Scroll"
    Command="{Binding ScrollToVisible}">
    <Button.CommandParameter>
        <Rock:ScrollToVisibleParameters Anchor="{x:Reference myLabel}"
            Position="Start" />
    </Button.CommandParameter>
</Button>
<Button Text="Scroll"
    Command="{Binding ScrollToVisible}"
    CommandParameter="{Rock:ScrollToVisibleParameters Anchor={x:Reference myLabel}, Position=Start}" />
<Button Text="Remove Value"
    Command="{Binding SetAppValue}"
    CommandParameter="KeyToRemove" />
<Button Text="Set Value"
    Command="{Binding SetAppValue}"
    CommandParameter="KeyToSet=SomeValue" />
{{ AppValues | ToJSON }}

Name

string

The name of the entity whose context is to be set. For example Campus.

Value

Guid?

The Guid value to set the context name to. If this is left blank then the context is unset. Defaults to null.

<Button Text="Tap"
    Command="{Binding SetContext}">
    <Button.CommandParameter>
        <Rock:SetContextParameters Name="Campus"
           Value="e4d80e57-da60-4822-bc22-c071f02958e8" />
    </Button.CommandParameter>
</Button>
<Button Text="Set User Preference"
    Command="{Binding SetUserPreference}"
    CommandParameter="KeyToSet=SomeValue" />
<Button Text="Remove User Preference"
    Command="{Binding SetUserPreference}"
    CommandParameter="KeyToRemove" />
<Button x:Name="myButton"
    StyleClass="btn,btn-success"
    Text="Tap Me"
    Command="{Binding SetViewProperty}"
    CommandParameter="{Rock:SetViewPropertyParameters View={x:Reference myButton}, Name=StyleClass, Value='btn,btn-danger'}" />
<Button x:Name="myButton2"
    StyleClass="btn,btn-success"
    Text="Tap Me"
    Command="{Binding SetViewProperty}">
    <Button.CommandParameter>
        <Rock:SetViewPropertyParameters View="{x:Reference myButton2}">
            <Rock:Parameter Name="StyleClass" Value="btn,btn-danger" />
            <Rock:Parameter Name="Text" Value="Tapped" />
        </Rock:SetViewPropertyParameters>
    </Button.CommandParameter>
</Button>
<Button x:Name="myButton3"
    StyleClass="btn,btn-success"
    Text="Tap Me"
    IsEnabled="False"
    IsVisible="False" />
<Button x:Name="myButton4"
    StyleClass="btn,btn-success"
    Text="Tap Me"
    Command="{Binding AggregateCommand}">
    <Button.CommandParameter>
        <Rock:AggregateCommandParameters>
            <Rock:CommandReference Command="{Binding SetViewProperty}">
                <Rock:SetViewPropertyParameters View="{x:Reference myButton3}"
                    Name="IsVisible"
                    Value="True" />
            </Rock:CommandReference>
            <Rock:CommandReference Command="{Binding SetViewProperty}">
                <Rock:SetViewPropertyParameters View="{x:Reference myButton4}"
                    Name="IsVisible"
                    Value="False" />
            </Rock:CommandReference>
        </Rock:AggregateCommandParameters>
    </Button.CommandParameter>
</Button>

Title

string

The title of the action panel; keep it short!

CancelTitle

string

The text to display in the cancel button (optional). Defaults to empty string.

DestructiveButton

ActionPanelButton

Defines the button that implies a destructive operation, for example on iOS this button becomes red (optional).

Defaults to null.

Buttons

ICollection<ActionPanelButton>

A collection of buttons to be shown, this is the default content property meaning you would just add ActionPanelButton nodes as child elements.

<Button Text="Actions"
    StyleClass="btn, btn-primary"
    Command="{Binding ShowActionPanel}">
    <Button.CommandParameter>
        <Rock:ShowActionPanelParameters Title="My Action Sheet"
            CancelTitle="Do Nothing">
            <Rock:ShowActionPanelParameters.DestructiveButton>
                <Rock:ActionPanelButton Title="Delete"
                    Command="{Binding PushPage}"
                    CommandParameter="c258265c-9645-46f1-a69b-0e0f149e5e83" />
            </Rock:ShowActionPanelParameters.DestructiveButton>
            <Rock:ActionPanelButton Title="First Button"
                Command="{Binding OpenBrowser}"
                CommandParameter="https://www.rockrms.com" />
            <Rock:ActionPanelButton Title="Second Button"
                Command="{Binding OpenExternalBrowser}"
                CommandParameter="https://community.rockrms.com/" />
        </Rock:ShowActionPanelParameters>
    </Button.CommandParameter>
</Button>
<Button Text="Actions"
    StyleClass="btn, btn-primary"
    Command="{Binding ShowActionPanel}">
    <Button.CommandParameter>
        <Rock:ShowActionPanelParameters Title="My Action Sheet"
            CancelTitle="Do Nothing"
            DestructiveButton="{Rock:ActionPanelButton Title=Delete, Command={Binding PushPage}, CommandParameter=c258265c-9645-46f1-a69b-0e0f149e5e83}">
            <Rock:ActionPanelButton Title="First Button"
                Command="{Binding OpenBrowser}"
                CommandParameter="https://www.rockrms.com" />
            <Rock:ActionPanelButton Title="Second Button"
                Command="{Binding OpenExternalBrowser}"
                CommandParameter="https://community.rockrms.com/" />
        </Rock:ShowActionPanelParameters>
    </Button.CommandParameter>
</Button>

ChannelId

int?

The identifier of the channel where this interaction will be recorded. Must already exist. Defaults to null.

ChannelGuid

Guid?

The unique identifier of the channel where this interaction will be recorded. Must already exist. Defaults to null.

ComponentId

int?

Specifies a specific component identifier where this interaction will be recorded. If used, the component must already exist. Defaults to null.

ComponentName

string

Specifies a component name for where this interaction will be recorded. If you use this property to pick the component then the system will look for a matching component and if not found create one. Defaults to null.

ComponentEntityId

int?

If the channel is configured to have an Entity associated with the components then this would provide the Id of the Entity if it gets created from the ComponentName property. Defaults to null.

Data

string

Custom data that should be stored with the interaction. There is no specific format requirements, as long as the data is a string. Defaults to null.

EntityId

int?

Associates the interaction with the specified entity. The entity type will be taken from the channel configuration. Defaults to null.

Operation

string

The type of operation that identifies this interaction. There is no specific list of strings that you must use, but a few suggestions are View and Watch. Defaults to null.

Summary

string

The text that describes this event in a user friendly manner. Defaults to null.

RelatedEntityTypeId

int?

Sets the EntityTypeId of the related entity that should be associated with this Interaction. Defaults to null.

RelatedEntityId

int?

Sets the EntityId of the related entity that should be associated with this Interaction. Defaults to null.

ChannelCustom1

string

Sets the first custom interaction string value. Defaults to null.

ChannelCustom2

string

Sets the second interaction string value. Defaults to null.

ChannelCustomIndexed1

string

Sets the first custom indexed interaction string value. Defaults to null.

IsMultipleAllowed

bool

Specifies if multiple interactions can be written for this single command. If set to true then each time the command is executed a new interaction will be written. Otherwise only the first execution will write an interaction. Note: If the page is reloaded then a new parameter object is created and a new interaction could again be written. Defaults to false.

SendMode

InteractionSendMode

Currently accepts two values:

Queued: Adds the interaction to the internal queue, that posts to the server every so often. This is recommended and is used to maintain high performance.

Immediate: In some rare cases, you may want to make sure an interaction gets posted to the server as soon as possible. This will cause the interaction to bypass the internal queue and post immediately upon execution. Be cautious using this, as you could flood your server with POST requests.

Defaults to Queued.

<Button Text="Like" Command="{Binding WriteInteraction}">
    <Button.CommandParameter>
        <Rock:InteractionParameters Operation="Like"
            Summary="I like this."
            ChannelId="3"
            ComponentId="87" />
    </Button.CommandParameter>
</Button>
<Button Text="Tap"
    Command="{Binding ShowPopup}"
    CommandParameter="e4d80e57-da60-4822-bc22-c071f02958e8?GroupId=18&amp;Mode=Edit" />
<Button Text="Tap"
    Command="{Binding ShowPopup}">
    <Button.CommandParameter>
        <Rock:ShowPopupParameters Title="Select Group"
            PageGuid="e4d80e57-da60-4822-bc22-c071f02958e8">
            <Rock:Parameter Name="ParentGroupId" Value="8293" />
        </Rock:ShowPopupParameters>
    </Button.CommandParameter>
</Button>
<Button Text="Tap"
    Command="{Binding ShowPopup}">
    <Button.CommandParameter>
        <Rock:ShowPopupParameters Title="Select Group"
            Anchor="Top">
            <Rock:ShowPopupParameters.Content>
                <StackLayout>
                    <Label Text="Hello Rock" />
                    <Button Text="Close"
                        Command="{Binding ClosePopup}" />
                </StackLayout>
            </Rock:ShowPopupParameters.Content>
        </Rock:ShowPopupParameters>
    </Button.CommandParameter>
</Button>
<Button Text="Close"
    Command="{Binding ClosePopup}" />
<StackLayout Orientation="Horizontal">
    {% assign group = 70 | GroupById %}
    
    <Button Text="Follow"
        Command="{Binding Follow}">
        <Button.CommandParameter>
            <Rock:FollowParameters EntityId="{{ group.Id }}"
                EntityTypeId="{{ group.TypeId }}" />
        </Button.CommandParameter>
    </Button>
    
    <Button Text="Unfollow"
        Command="{Binding Follow}">
        <Button.CommandParameter>
            <Rock:FollowParameters IsFollow="False"
                EntityId="{{ group.Id }}"
                EntityTypeId="{{ group.TypeId }}"
                NotificationText="Unfollowed!" />
        </Button.CommandParameter>
    </Button>
</StackLayout>

Text

string

The text to display in the Toast.

Duration

ToastDuration

Either long (3.5 seconds) or short (2.0 seconds).

FontSize

int

The font size of the toast.

<Button Text="Toast Me"
    Command="{Binding ShowToast}"
    CommandParameter="Default Toast styling." /> 
<Button Text="Toast Me 2"
    Command="{Binding ShowToast}"
    CommandParameter="{Rock:ShowToastParameters Text='Butter or jam?' Duration='Long' FontSize='32'}" />
<Button Text="Tap"
    StyleClass="btn, btn-primary"
    Command="{Binding ShowCoverSheet}"
    CommandParameter="71e80253-8d10-426b-8182-65dafe9b695f" /> <!-- Page Guid -->
<Button Text="Tap"
    Command="{Binding CloseCoverSheet}" />
<Button Text="Update Photo"
    Command="{Binding UpdatePersonProfilePhoto}"
    CommandParameter="8fedc6ee-8630-41ed-9fc5-c7157fd1eaa4" />

PersonGuid

Guid

The Guid of the Person to update the profile photo for.

Image

Image

The image to update the source of when the new profile image is uploaded.

<Rock:Image x:Name="PersonImage"
    Source="image.png" />

<Button Text="Update Photo"
    Command="{Binding UpdatePersonProfilePhoto}">
    <Button.CommandParameter>
        <Rock:UpdatePersonProfilePhotoCommandParameters Image="{x:Reference Name=PersonImage}" />
    </Button.CommandParameter>
</Button>

TimeToExpire

int

The amount of time (in minutes) before the entity set expires.

QueryStringParameterKey

string

The key associated with the newly generated Entity Set that will be passed along through the query string. Defaults to EntitySetGuid.

EntityTypeGuid

Guid

The Guid of the type of entity this entity set is in relation to.

EntityItemGuids

List<string>

A list of the string Guid entity set items. You should only include entities that are of the same type provided by the EntityTypeGuid.

NavigateCommand

CommandReference

The navigation command to execute with the new entity set query string parameter.

<Button Text="Create Entity Set And Navigate"
    Command="{Binding CreateEntitySetAndNavigate}">
    <Button.CommandParameter>
        <Rock:CreateEntitySetAndNavigateParameters EntityTypeGuid="72657ED8-D16E-492E-AC12-144C5E7567E7">
            <Rock:CreateEntitySetAndNavigateParameters.EntityItemGuids>
                <x:String>66D0FD8B-BFA0-41EA-8DAD-000040D0890D</x:String>
                <x:String>EE161CC8-5C25-4BA2-9E41-0000C8B80A39</x:String>
            </Rock:CreateEntitySetAndNavigateParameters.EntityItemGuids>
            <Rock:CreateEntitySetAndNavigateParameters.NavigateCommand>
                <Rock:CommandReference Command="{Binding PushPage}"
                    CommandParameter="f0ef45ac-4eb8-4ad1-b817-408d7d7fe0fc" />
            </Rock:CreateEntitySetAndNavigateParameters.NavigateCommand>
        </Rock:CreateEntitySetAndNavigateParameters>
    </Button.CommandParameter>
</Button>
Following Icon
Cover Sheet
Cover Sheet
SetAppValue
ShowPopup
SetViewProperty
ShowActionPanel
Actions on iOS with automatic dark and light mode, revealed at the bottom of the screen
Actions on Android that don't change with light or dark theme, revealed in the center of the screen
The action panel options shown with this command
OnPlatform extension
here
AggregateCommand
InteractionParameters
Security Considerations

StartDateTime

DateTime

The start date and time of the event. If you provide any time zone information here it will be ignored.

EndDateTime

DateTime

The end date and time of the event. If you leave this blank then the time information from the StartDateTime will be dropped and it will become an all day event.

Title

string

The title (or name) of the event. Space is often limited when displaying the title so remember to keep it short.

Notes

string

Additional notes about the event. Think of this as the details when opened information.

Location

string

The location of the event. This can technically be anything you like such as "Main Auditorium", but if you put in an actual address then devices will usually make it link to the maps application.

Url

string

A URL that the user can follow to get more information about the event.

TimeZoneId

string

AlarmInMinutes

int

If set then an alarm will be added to the event that triggers this many minutes before the event happens.

Commands

The collection of commands that will be executed. This is the default property so you don't need to explicitly specify it.

Name

string

The name of the callback to be called on the server. (Required Field)

Parameters

Any parameters that will be passed to the callback function.

Validator

Optional reference to a validator that will be executed before sending the command to the block. If the validator fails then the command is not sent.

ReloadPage

bool

If true then the current page is reloaded instead of navigating away. Defaults to false.

PageGuid

Guid?

The page to navigate to instead of the home page. Defaults to null.

Parameters

Optional parameters to pass to the page in the query string. Defaults to empty.

Event

string

The name of the event to be triggered.

Parameters

Any parameters that will be passed to the Lava engine, these manifest as lava variables.

Anchor

VisualElement

The view which resides inside a ScrollView that should be made visible.

Position

ScrollToPosition

The position to put the view at after scrolling (see below). Defaults to MakeVisible

Boolean

Sets whether the scroll should be animated. Defaults to True

View

View

The view that will have it's property value changed.

Name

string

The name of the property to change.

Value

object

The value to set. This will almost always be given as a string, but it will be automatically converted just as if you typed the same value into a normal XAML property.

Values

Anchor

ShowPopupAnchor

Where to anchor the popup, possible values are Center, Top, and Bottom.

Defaults to Center.

Content

View

The view to display inside the popup, if set this will override the PageGuid property.

PageGuid

Guid

The Rock page to be displayed inside the popup.

Parameters

A collection of query string parameters that will be passed to the Rock page.

Title

string

The title of the popup.

ShowHeader

bool

Determines if the header should be shown. If disabled then you have complete control of the design. Defaults to True.

EntityId

int

The Id of the entity to follow or unfollow.

EntityTypeId

int

The Id of the entity type to follow or unfollow.

PurposeKey

string

An optional parameter that allows you to set a 'Purpose Key' while following or unfollowing.

NotificationText

string

The text to display on the Toast when an item is successfully followed/unfollowed. Note: Setting this as empty ("") will remove the Toast from ever being displayed, if you wish to do that.

NotificationType

The notification type of the Toast to be displayed.

IsFollow

bool

Whether or not the command is used to follow or unfollow, set to false to configure "unfollowing" behavior. Defaults to true.

UseHapticFeedback

bool

If enabled, the command will perform haptic feedback when tapped. Defaults to true.

Developer

The IANA time zone identifier that the StartDateTime and EndDateTime are in. For example, "America/Phoenix".

ICollection<>

List<>

List<>

List<>

Animated

ICollection<>

A collection of parameters that describe the properties and there values to set. This is the default content property, meaning you would just add nodes as child elements if you use this.

List<>

Time zone reference sheet
CommandReference
Parameter
Validator
Parameter
Parameter
Parameter
Parameter
Parameter
Advanced: Dynamic Content
Push Notification State
BibleBrowser
NotifcationType
scroll-included
Shell Lava Variables
AppValues
App Value
scroll-included
scroll-included
Integrated Scroll
scroll-included